Ajax TabPanels 触发 ASP.Net 4.0 中其他选项卡的验证

Question

我有 Ajax TabPanel，在 员工列表 选项卡上带有选项卡“员工列表”“添加员工”“编辑员工”

我使用 gridview 来显示员工列表以及链接按钮以在同一选项卡上查看员工的详细信息， “删除”按钮可删除员工。它工作正常，但是当我将控件添加到第二个选项卡“添加员工”以及验证控件时。在选项卡中的此 gridview 不起作用后，它会触发第二个选项卡上的验证。

我如何停止由选项卡 1 上的控件触发的验证

下面是代码

   <asp:TabContainer ID="TabContainer1" runat="server" Height="320px" Width="100%" 
        ActiveTabIndex="0" >
    <asp:TabPanel ID="atpEmployeeList" runat="server"   >
    <HeaderTemplate>Employee List</HeaderTemplate>
    <ContentTemplate>
    <table border="0"  width="100%" cellpadding="0" cellspacing="0">
    <tr>
    <td class="style1" align="left" valign="top">
    <b>Employee List</b>
            <asp:GridView ID="gvEmployeeList" runat="server" AutoGenerateColumns="False" 
            DataKeyNames="eCode" BackColor="White" BorderColor="#336666" 
            BorderStyle="None" BorderWidth="2px" CellPadding="4" 
            GridLines="Horizontal" onrowcommand="gvEmployeeList_RowCommand" 
            onrowdatabound="gvEmployeeList_RowDataBound"  >
            <Columns>
                <asp:BoundField DataField="eSno" HeaderText="ID" InsertVisible="False" 
                    ReadOnly="True" SortExpression="eSno" />
                <asp:BoundField DataField="eFirstName" HeaderText="First Name" 
                    SortExpression="eFirstName" />
                <asp:BoundField DataField="eLastName" HeaderText="Last Name" 
                    SortExpression="eLastName" />
                <asp:BoundField DataField="eDepartment" HeaderText="Department" 
                    SortExpression="eDepartment" />
                <asp:BoundField DataField="eSalary" HeaderText="Salary" 
                    SortExpression="eSalary" />
   <asp:TemplateField HeaderText="Details">
     <ItemTemplate>
       <asp:LinkButton ID="lnkBtnEmpDetails" CommandArgument='<%# Eval("eSno") %>' CommandName="ViewDetails" runat="server">
         View</asp:LinkButton>
     </ItemTemplate>
   </asp:TemplateField>
   <asp:TemplateField HeaderText="Delete">
     <ItemTemplate>
       <asp:LinkButton ID="lnkBtnEmpDelete" CommandArgument='<%# Eval("eSno") %>' CommandName="Delete" runat="server">
         Del</asp:LinkButton>
     </ItemTemplate>
   </asp:TemplateField>
            </Columns>
            <FooterStyle BackColor="White" ForeColor="#333333" />
            <HeaderStyle BackColor="#336699" Font-Bold="True" ForeColor="White" />
            <PagerStyle BackColor="#336699" ForeColor="White" HorizontalAlign="Right" />
            <RowStyle BackColor="White" ForeColor="#333333" />
            <SelectedRowStyle BackColor="#339966" Font-Bold="True" ForeColor="White" />
            <SortedAscendingCellStyle BackColor="#F7F7F7" />
            <SortedAscendingHeaderStyle BackColor="#487575" />
            <SortedDescendingCellStyle BackColor="#E5E5E5" />
            <SortedDescendingHeaderStyle BackColor="#275353" />
        </asp:GridView>
    </td>
    <td width="250px" align="left" valign="top">
    <b>Employee Details</b>
        <br />
        <table width="280px" align="left" cellpadding="3" cellspacing="0" >
            <tr>
                <td class="style8" bgcolor="#336699">
                    Code</td>
                <td>
                    <asp:Label ID="lblEmpCode" runat="server" ></asp:Label>
                </td>
            </tr>
            <tr>
                <td class="style8" bgcolor="#336699">
                    Fisrt Name</td>
                <td>
                    <asp:Label ID="lblFirstName" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td class="style5" bgcolor="#336699">
                    Last Name</td>
                <td class="style6">
                    <asp:Label ID="lblLastName" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td class="style8" bgcolor="#336699">
                    Designation</td>
                <td>
                    <asp:Label ID="lblDesignation" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td class="style8" bgcolor="#336699">
                    Department</td>
                <td>
                    <asp:Label ID="lblDepartment" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td class="style8" bgcolor="#336699">
                    Salary</td>
                <td>
                    <asp:Label ID="lblSalary" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td class="style8" bgcolor="#336699">
                    Join Date</td>
                <td>
                    <asp:Label ID="lblJoinDate" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td class="style8" bgcolor="#336699">
                    Phone</td>
                <td>
                    <asp:Label ID="lblPhone" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td class="style8" bgcolor="#336699">
                    Address</td>
                <td>
                    <asp:Label ID="lblAddress" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td class="style8" bgcolor="#336699">
                    City</td>
                <td>
                    <asp:Label ID="lblCity" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td class="style4">
                    &nbsp;</td>
                <td>
                    &nbsp;</td>
            </tr>
        </table>
    </td>
    </tr>
    </table>
    </ContentTemplate>
    </asp:TabPanel>

    <asp:TabPanel ID="atpAddEmployee" runat="server" >
    <HeaderTemplate>Add Employee</HeaderTemplate>
    <ContentTemplate>
    <div><b>Enter Details of New Employee</b></div>
    <table border="0px"><tr>
    <td width="400px">
    <div class="spacer"></div>
           <div class="row">
                <asp:Label ID="lblAEmpCode" CssClass="txtLabel" runat="server" Text="Code :"></asp:Label>
                <asp:TextBox ID="txtACode" runat="server" CssClass="txt4Digit"></asp:TextBox>
                <asp:RequiredFieldValidator ID="rfvCode" runat="server" ErrorMessage="*" 
                    ControlToValidate="txtACode"></asp:RequiredFieldValidator>
           </div>
           <div class="row">
                <asp:Label ID="lblAFN" CssClass="txtLabel" runat="server" Text="First Name :"></asp:Label>
                <asp:TextBox ID="txtAFN" runat="server" CssClass="txtbox"></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="*" 
                    ControlToValidate="txtAFN"></asp:RequiredFieldValidator>
           </div>
           <div class="row">
                <asp:Label ID="lblALN" CssClass="txtLabel" runat="server" Text="Last Name :"></asp:Label>
                <asp:TextBox ID="txtALN" runat="server" CssClass="txtbox"></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="*" 
                    ControlToValidate="txtALN"></asp:RequiredFieldValidator>
           </div>
           <div class="row">
                <asp:Label ID="lblADesignation" CssClass="txtLabel" runat="server" Text="Designation :"></asp:Label>
                <asp:TextBox ID="txtADesignation" runat="server" CssClass="txtbox"></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="*" 
                    ControlToValidate="txtADesignation"></asp:RequiredFieldValidator>
           </div>
           <div class="row">
                <asp:Label ID="lblADepartment" CssClass="txtLabel" runat="server" Text="Department :"></asp:Label>
                <asp:TextBox ID="txtADepartment" runat="server" CssClass="txtbox"></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ErrorMessage="*" 
                    ControlToValidate="txtADepartment"></asp:RequiredFieldValidator>
           </div>
           <div class="row">
                <asp:Label ID="lblASalary" CssClass="txtLabel" runat="server" Text="Salary :"></asp:Label>
                <asp:TextBox ID="txtASalary" runat="server" CssClass="txtbox"></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ErrorMessage="*" 
                    ControlToValidate="txtASalary"></asp:RequiredFieldValidator>
           </div>
           <div class="row">
                <asp:Label ID="lblAJoinDate" CssClass="txtLabel" runat="server" Text="Join Date :"></asp:Label>
                <asp:TextBox ID="txtAJoinDate" runat="server" CssClass="txtbox"></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ErrorMessage="*" 
                    ControlToValidate="txtAJoinDate"></asp:RequiredFieldValidator>
           </div>
    </td>
    <td width="400px">
        <div class="spacer"></div>
           <div class="row">
                <asp:Label ID="lblAAddress" CssClass="txtLabel" runat="server" Text="Address :"></asp:Label>
                <asp:TextBox ID="txtAAddress" runat="server" CssClass="txtbox"></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator7" runat="server" ErrorMessage="*" 
                    ControlToValidate="txtAAddress"></asp:RequiredFieldValidator>
           </div>
           <div class="row">
                <asp:Label ID="lblACity" CssClass="txtLabel" runat="server" Text="City :"></asp:Label>
                <asp:TextBox ID="txtACity" runat="server" CssClass="txtbox"></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator8" runat="server" ErrorMessage="*" 
                    ControlToValidate="txtACity"></asp:RequiredFieldValidator>
           </div>
           <div class="row">
                <asp:Label ID="lblACountry" CssClass="txtLabel" runat="server" Text="Country :"></asp:Label>
                        <asp:UpdatePanel ID="updatepanel1" runat="server">
                            <ContentTemplate>
                            <asp:DropDownList ID="ddCountry" runat="server" CssClass="ddGeneral" DataTextField="Country" 
                                DataValueField="CountryId" OnSelectedIndexChanged="ddCountry_SelectedIndexChanged"
                                AutoPostBack="true" AppendDataBoundItems="true" >
                                <asp:ListItem Value="0">Select Country</asp:ListItem>
                            </asp:DropDownList>
                        </ContentTemplate>
                    </asp:UpdatePanel>
           </div>
           <div class="row">
                <asp:Label ID="lblAState" CssClass="txtLabel" runat="server" Text="State :"></asp:Label>
                <asp:UpdatePanel ID="updatePnlState" runat="server">
                    <ContentTemplate>
                    <asp:DropDownList ID="ddState" runat="server" CssClass="ddGeneral" DataTextField="Region" DataValueField="RegionId" AppendDataBoundItems="true">
                    <asp:ListItem Value="0">Select State</asp:ListItem>
                    </asp:DropDownList>
                </ContentTemplate>
                </asp:UpdatePanel>
                <asp:UpdateProgress ID="updProgLoading" runat="server" >
                <ProgressTemplate>
                    <img src="images/ajax-loader-small.gif" align="left" alt="Loading..." vspace="0"  />&nbsp;
                </ProgressTemplate>
                </asp:UpdateProgress>
           </div>
           <div class="row">
                <asp:Label ID="lblALL" CssClass="txtLabel" runat="server" Text="Landline :"></asp:Label>
                <asp:TextBox ID="txtALL" runat="server" CssClass="txtbox"></asp:TextBox>
           </div>
           <div class="row">
                <asp:Label ID="lblAMobile" CssClass="txtLabel" runat="server" Text="Mobile :"></asp:Label>
                <asp:TextBox ID="txtAMobile" runat="server" CssClass="txtbox"></asp:TextBox>
           </div>
           <div class="row">
                <asp:Label ID="lblAEmail" CssClass="txtLabel" runat="server" Text="Email :"></asp:Label>
                <asp:TextBox ID="txtAEmail" runat="server" CssClass="txtbox"></asp:TextBox>
                <asp:RequiredFieldValidator ID="RequiredFieldValidator13" runat="server" ErrorMessage="*" 
                    ControlToValidate="txtAEmail"></asp:RequiredFieldValidator>
    </div>
    </td>
    </tr>
    <tr><td colspan="2" align="center" height="40px">

        <asp:Button ID="btnAddEmployee" runat="server" Text="Add Employee" 
            CssClass="btn" onclick="btnAddEmployee_Click" /> <input id="Reset1" type="reset" class="btn" value="Reset" />
    </td></tr>
    </table>
   </ContentTemplate>
    </asp:TabPanel>

    <asp:TabPanel ID="atpEditEmployee" runat="server" >
    <HeaderTemplate>Edit Employee</HeaderTemplate>
                <ContentTemplate>
                    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><br />
                    <input id="Button2" type="button" value="Next" onclick="MoveTab(1)" />
                </ContentTemplate>
    </asp:TabPanel>

    </asp:TabContainer>

Answer 1

您应该考虑利用验证器的 ValidationGroup 属性。例如，对于 atpAddEmployee 选项卡中的所有验证器，您可以设置类似 ValidationGroup="atpAddEmployee" 的属性或您认为合适的任何其他名称。

我从 atpAddEmployee 选项卡中获取了其中一个验证器，并添加了如上所述的属性。

<asp:RequiredFieldValidator ID="rfvCode" runat="server" ErrorMessage="*" ControlToValidate="txtACode" ValidationGroup="atpAddEmployee"></asp:RequiredFieldValidator>

对于该特定选项卡，您还需要将 ValidationGroup 属性添加到应触发验证的按钮，请参见下文。

<asp:Button ID="btnAddEmployee" runat="server" Text="Add Employee" CssClass="btn" onclick="btnAddEmployee_Click" ValidationGroup="atpAddEmployee" />

一些进一步的阅读，MSDN和 W3Schools。