Использовать дополнительный столбец начальной загрузки, если содержимое не видно?

Question

Я использую asp с сеткой бутстрапа.

Допустим, мое текстовое поле принимает цв-х-11 и искомое поле валидатор принимает Col-х-1 (только содержит *), и это отображение свойства установлено значение «Dynamic» ..

Если валидатор не отображается, столбец остается занятым. Я бы хотел, чтобы текстовое поле также занимало этот столбец, если валидатор не виден. Но если валидатор виден, он снова занимает его столбец.

Есть ли способ сделать это ??

Answer 1

Один из способов - использовать CustomValidator и использовать его возможность указать клиентскую функцию, чтобы изменить способ отображения вашего текстового поля.

Markup

<div class="row"> 
    <div class="col-xs-12"><asp:TextBox ID="txtName" runat="server" CssClass="form-control" /></div> 
    <asp:CustomValidator ID="valName" runat="server" Text="*" Display="Dynamic" CssClass="col-xs-1" 
     ClientValidationFunction="valName_ClientValidate" 
     OnServerValidate="valName_ServerValidate" /> 
</div> 

JavaScript

function valName_ClientValidate(sender, args) { 
    var $textbox = $('#<%= txtName.ClientID %>'); 
    if ($textbox.val() != '') { 
     args.IsValid = true; 
     $textbox.parent().removeClass('col-xs-11').addClass('col-xs-12'); 
    } else { 
     args.IsValid = false; 
     $textbox.parent().removeClass('col-xs-12').addClass('col-xs-11'); 
    } 
} 

Примечание: Как вы используете Bootstrap, библиотека JQuery доступна.

C#

protected void valName_ServerValidate(object source, ServerValidateEventArgs args) 
{ 
    args.IsValid = !String.IsNullOrEmpty(txtName.Text); 
}