如何根据条件应用/删除asp.net所需的3种不同DIV验证？ [英] How to apply/remove asp.net required validation for 3 different DIV based on condition?

问题描述

我有一个ASPX UI页面，其中有3个不同的标签逐个提交

I have an ASPX UI page in which there are 3 different tabs which are getting submitted one by one

这三个标签如下：

标签1-注册
标签2-详细信息
标签3-联系我们

tab 1- registration tab 2- details tab 3- contact Us

我使用单曲提交按钮提交所有3个标签（根据条件）

I am using single submit button to submit all 3 tabs (based on condition)

我想禁用div 2&中其他字段的验证3，当我在1 div中提交表格时。即在注册div中，当我点击提交其他2个div时，不得给出验证错误。 &安培;同时提交其他2个div。

I want to disable validation for other fields in div 2 & 3, when i submit form in 1 div. i.e. in registration div when i click submit other 2 divs must not give validation error. & same while submitting other 2 divs.

<div id=mainDiv>
 <ul class="nav nav-tabs nav-justified" id="steps-lap">
   <li role="presentation" class="active" id="listOne" runat="server"><asp:HyperLink ID="tabOne" runat="server" NavigateUrl="#tab_one" data-toggle="tab">1: Basic Details</asp:HyperLink></li>
   <li role="presentation" id="listTwo" runat="server"><asp:HyperLink ID="tabTwo" runat="server" NavigateUrl="#tab_two" data-toggle="tab">2: Property Details</asp:HyperLink></li>
   <li role="presentation" id="listThree" runat="server"><asp:HyperLink ID="tabThree" runat="server" NavigateUrl="#tab_three" data-toggle="tab">3: Finish</asp:HyperLink></li>
 </ul>


<div class="tab-content" id="tab-content">

<!-- TAB-1 STARTS-->
<div class="tab-pane fade active in" role="tabpanel" id="tab_one" aria-labelledby="home-tab">
 <div id="registrationDetails">
  <asp:TextBox ID="txtFullName" runat="server" class="form-control input-md" placeholder="" TabIndex="1" onkeypress="return keyRestrictValidChars(event, 'abcdefghijklmnopqrstuvwxyz');"></asp:TextBox>
  <asp:RequiredFieldValidator CssClass="rfv-error" ID="RequiredFieldValidator5" runat="server" ErrorMessage="* required" SetFocusOnError="true" ControlToValidate="txtFullName" ValidationGroup="DetailsGroup"></asp:RequiredFieldValidator>

  <asp:TextBox ID="txtLastName" runat="server" class="form-control input-md" placeholder="" TabIndex="1" onkeypress="return keyRestrictValidChars(event, 'abcdefghijklmnopqrstuvwxyz');"></asp:TextBox>
  <asp:RequiredFieldValidator CssClass="rfv-error" ID="RequiredFieldValidator1" runat="server" ErrorMessage="* required" SetFocusOnError="true" ControlToValidate="txtFullName" ValidationGroup="DetailsGroup"></asp:RequiredFieldValidator>                                                    
 </div>
</div>
<!-- TAB-1 ENDS-->

<!-- TAB-2 STARTS-->
<div class="tab-pane fade" role="tabpanel" id="tab_two" aria-labelledby="dropdown2-tab">
   <div id="AllContent" runat="server" class="form-group" style="display:block;">
    <asp:TextBox ID="txtContact" runat="server" class="form-control input-md" placeholder="" TabIndex="1" onkeypress="return keyRestrictValidChars(event, 'abcdefghijklmnopqrstuvwxyz');"></asp:TextBox>
    <asp:RequiredFieldValidator CssClass="rfv-error" ID="RequiredFieldValidator5" runat="server" ErrorMessage="* required" SetFocusOnError="true" ControlToValidate="txtContact" ValidationGroup="DetailsGroup"></asp:RequiredFieldValidator>

    <asp:TextBox ID="txtEmail" runat="server" class="form-control input-md" placeholder="" TabIndex="1" onkeypress="return keyRestrictValidChars(event, 'abcdefghijklmnopqrstuvwxyz');"></asp:TextBox>
    <asp:RequiredFieldValidator CssClass="rfv-error" ID="RequiredFieldValidator1" runat="server" ErrorMessage="* required" SetFocusOnError="true" ControlToValidate="txtEmail" ValidationGroup="DetailsGroup"></asp:RequiredFieldValidator>
  </div>
</div>
<!-- TAB-2 ENDS-->

<!-- TAB-3 STARTS-->
<div class="tab-pane fade " role="tabpanel" id="tab_three" aria-labelledby="dropdown3-tab">
 <div id="CompletedContent">
 <asp:TextBox ID="txtEmail" runat="server" class="form-control input-md" placeholder="" TabIndex="1" onkeypress="return keyRestrictValidChars(event, 'abcdefghijklmnopqrstuvwxyz');"></asp:TextBox>
 <asp:RequiredFieldValidator CssClass="rfv-error" ID="RequiredFieldValidator1" runat="server" ErrorMessage="* required" SetFocusOnError="true" ControlToValidate="txtEmail" ValidationGroup="DetailsGroup"></asp:RequiredFieldValidator>
</div>
</div>
<!-- TAB-3 ENDS -->


<div class="input-group">
  <asp:Button ID="btnSubmit" runat="server" OnClick="btnSubmit_Click" Class="btn btn-default-color btn-sm" Text="Submit" CausesValidation="false" ValidationGroup="DetailsGroup"/>
</div>

</div>
</div>

如果我在第一个标签中提交字段，第一个标签页上的代码显示将会激活保存，将移动到第二个选项卡，然后第二个选项卡中的字段将被填充&am​​p;已提交，第3个标签将处于活动状态。

As shown in the code on page load 1st tab will be active when i submit fields in 1st tab will be saved, will move to 2nd tab, then fields in 2nd tab will be filled & submitted, 3rd tab will be active.

但现在发生的是当我提交第1个标签的详细信息时，由于其他两个div中的文本字段，它会提供必要的字段验证错误。

But what happening now is when i submit details of 1st tab, it gives required field validation error because of textfields in other two divs.

有没有办法处理这种情况？

Is there any way to handle such condition??

我在codebehind .cs文件中有切换案例，基于此对提交的div执行操作。

I have switch case in codebehind .cs file, based on which the action on submitted div will be performed.

注意：提到的文本框字段仅用于分类目的！

Note : textbox fields mentioned are for classification purpose only!

一旦填满，我也可以限制用户返回上一个标签。

Also can i restrict user to go back to previous tab once it is filled up.

ie当用户填写第一个选项卡中的数据时，它将转到第二个选项卡，第一个选项卡也将被禁用，用户无法转到第一个选项卡。

i.e. when user fills data in the 1st tab it will go to 2nd tab, also 1st tab will be disabled, user cant go to 1st tab.

任何建议都会有所帮助。谢谢！

Any suggestion will be helpful. thanks!!

推荐答案

您可以使用aspnet的 ValidationGroup 属性验证者。

You can use the ValidationGroup attibute of the aspnet Validators for that.

<div id="tab1">
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <br />
    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="TextBox1"
        ValidationGroup="tabgroup1" Display="Dynamic" runat="server"
        ErrorMessage="Tab 1 required"></asp:RequiredFieldValidator>
    <br />
    <asp:Button ID="Button1" runat="server" Text="Button tab 1" ValidationGroup="tabgroup1" />
</div>

<div id="tab2">
    <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
    <br />
    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" ControlToValidate="TextBox2"
        ValidationGroup="tabgroup2" Display="Dynamic" runat="server"
        ErrorMessage="Tab 2 required"></asp:RequiredFieldValidator>
    <br />
    <asp:Button ID="Button2" runat="server" Text="Button tab 2" ValidationGroup="tabgroup2" />
</div>

<div id="tab3">
    <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
    <br />
    <asp:RequiredFieldValidator ID="RequiredFieldValidator3" ControlToValidate="TextBox3"
        ValidationGroup="tabgroup3" Display="Dynamic" runat="server"
        ErrorMessage="Tab 3 required"></asp:RequiredFieldValidator>
    <br />
    <asp:Button ID="Button3" runat="server" Text="Button tab 3" ValidationGroup="tabgroup3" />
</div>

这篇关于如何根据条件应用/删除asp.net所需的3种不同DIV验证？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！