更新面板中的 2 个 asp 面板控件

Posted 2023-02-24

【中文标题】更新面板中的 2 个 asp 面板控件

【英文标题】：2 asp panel controls in an update panel

【发布时间】：2012-06-27 20:50:22

【问题描述】：

我在更新面板中保留了 2 个 asp 面板控件（带有文本框和按钮），因此我希望一次只显示 1 个。当我点击按钮时，下一个 asp 面板应该是可见的，旧的 asp 面板隐藏了。我无法弄清楚..这是代码...

<asp:UpdatePanel ID="updatepnlSSN" ChildrenAsTriggers="false" runat="server" UpdateMode="Conditional">
  <ContentTemplate>
     <asp:Panel ID="pnlSSNLookup" runat="server" BackColor="#EEE6DF" BorderColor="#274F73"
                            BorderStyle="Outset">
        <table>
           <tr>
            <td colspan="3">
   <asp:Label ID="lblMsg" runat="server" ForeColor="#713C2C"></asp:Label>
            </td>
           </tr>
           <tr>
            <td>
   <asp:Label ID="lblStudentID" runat="server" Text="State Student ID:" ForeColor="#274F73" ToolTip="State Student ID Label"></asp:Label>
            </td
            <td>
 &nbsp;&nbsp;&nbsp;
   <asp:TextBox ID="txtStudentID" runat="server" ToolTip="Enter the student's state ID number" AccessKey="i" TabIndex="1"></asp:TextBox>
            </td>
            <td>
   <asp:RegularExpressionValidator ID="valStudentID" runat="server" ControlToValidate="txtStudentID" ErrorMessage="Please enter numeric only" ValidationExpression="[0-9]+" ForeColor="#713C2C" Display="Dynamic">
</asp:RegularExpressionValidator>
<asp:RequiredFieldValidator ID="valStdntID" runat="server" ControlToValidate="txtStudentID" Display="Dynamic" ErrorMessage="Please enter a State Student ID" ForeColor="#713C2C"></asp:RequiredFieldValidator>
           </td>
         </tr>
         <tr>
           <td>
 <asp:Label ID="lblFName" runat="server" Text="Student Legal First Name:" ForeColor="#274F73" ToolTip="First Name Label"></asp:Label>
           <td>
           <td>
&nbsp;&nbsp;&nbsp;
 <asp:TextBox ID="txtFName" runat="server" AccessKey="f" TabIndex="2" ToolTip="Enter the Student's First Name"></asp:TextBox>
          </td>
                                    <td>
   <asp:RequiredFieldValidator ID="valFirstName" runat="server" ControlToValidate="txtFName" Display="Dynamic" ErrorMessage="Please enter the student's first name." ForeColor="#713C2C"></asp:RequiredFieldValidator>
          </td>
        </tr>
        <tr>
          <td>
   <asp:Label ID="lblDOB" runat="server" ForeColor="#274F73" Text="Student Date of Birth </br> (mm/dd/yyyy)" ToolTip="STudent's date of birth label"></asp:Label>
          </td>
          <td>
 <div style="position: relative;">
 &nbsp;&nbsp;&nbsp;
  <asp:TextBox ID="txtDOB" runat="server" AccessKey="d" TabIndex="3" ToolTip="Enter the student's date of birth"></asp:TextBox>
  <cc1:CalendarExtender ID="txtDOB_CalendarExtender" runat="server" Enabled="True" TargetControlID="txtDOB" PopupPosition="Right" Format="MM/dd/yyyy">
    </cc1:CalendarExtender>
     </div>
                                    </td>
                                    <td>
 <asp:RangeValidator ID="RangeValidator1" runat="server" ControlToValidate="txtDOB" ErrorMessage="Please enter a valid date:  mm/dd/yyyy" ForeColor="#713C2C" MaximumValue="01/01/2075" MinimumValue="01/01/1970" Type="Date" Display="Dynamic"></asp:RangeValidator>
  <asp:RequiredFieldValidator ID="valStudentDOB" runat="server" ControlToValidate="txtDOB" Display="Dynamic" ErrorMessage="Please enter the student's date of birth" ForeColor="#713C2C"></asp:RequiredFieldValidator>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        &nbsp;
                                    </td>
                                </tr>
                                <tr>
                                    <td>
 <asp:Button ID="btnSearchSSN" runat="server" Text="Search" AccessKey="s" TabIndex="4" ToolTip="Begin student search" />
                                    </td>
                                </tr>
                            </table>
                        </asp:Panel>
                        </td> </tr>
                        <tr>
                            <td>
                                &nbsp;
                            </td>
                        </tr>
                        <tr>
                            <td style="padding: 0 10px 0 10px">
 <asp:Panel ID="pnlSSNEntry" runat="server" BackColor="#EEE6DF" BorderColor="#274F73" BorderStyle="Outset" Visible="False" Height="110px">
   <table align="left">
                                        <tr>
           <td colspan="3">
   <asp:Label ID="lblSSnText" runat="server" ForeColor="#274F73" Text="Please enter the SSN for:  "></asp:Label>
   <asp:Label ID="lblSSNName" runat="server" ForeColor="#274F73"></asp:Label>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td colspan="3">
   <asp:Label ID="lblSSNSubmitMsg" runat="server" ForeColor="#713C2C"></asp:Label>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
   <asp:Label ID="lblSSN0" runat="server" ForeColor="#274F73" Text="Social Security Number:   "></asp:Label>
                                            </td>
                                            <td>
  &nbsp;&nbsp;&nbsp;
   <asp:TextBox ID="txtArea" runat="server" AccessKey="a" MaxLength="3" TabIndex="5" ToolTip="Enter the student's SSN area number" Width="29px"></asp:TextBox>
 &nbsp;&nbsp;
     <asp:TextBox ID="txtGroup" runat="server" AccessKey="g" MaxLength="2" TabIndex="6" ToolTip="Enter the student's SSN group number" Width="22px"></asp:TextBox>
                                                &nbsp;&nbsp;
    <asp:TextBox ID="txtSerial" runat="server" AccessKey="r" MaxLength="4" TabIndex="7" ToolTip="Enter the student's SSN serial number" Width="35px"></asp:TextBox>
                                            </td>
                                            <td>
   <asp:Label ID="lblSSNError" runat="server" ForeColor="#713C2C" Text="Please enter a valid Social Security Number" Visible="False"></asp:Label>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
                                                &nbsp;
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>
     <asp:Button ID="btnSSN" runat="server" Text="Submit SSN" AccessKey="n" TabIndex="8" ToolTip="Submit the student's SSN" />
                                            </td>
                                        </tr>
                                    </table>
                                </asp:Panel>
                    </ContentTemplate>
                    <Triggers>
   <asp:AsyncPostBackTrigger ControlID="btnSearchSSN" EventName="Click" />
   <asp:AsyncPostBackTrigger ControlID="btnSSN" EventName="Click" />
                    </Triggers>
                </asp:UpdatePanel>

【参考方案1】：

使用ASP:MultiView 会不会更好。然后您一次显示一个视图，它带有与之关联的互斥绑定。

<asp:MultiView>
    <asp:View>
       View 1
    </asp:View>
     <asp:View>
       View 2
    </asp:View>
</asp:MultiView>

【参考方案2】：

您最好在 UpdatePanel 中使用 MultiView 并根据按钮单击设置 ActiveView。这是tutorial

简而言之，MultiView 是面板的包装器。它包含可以激活的 View 对象的集合。在任何给定时间只能看到一个视图。

【参考方案3】：

上面的答案提出了解决上述问题的好方法，但如果您真的想这样做，请尝试在按钮点击事件上添加代码，例如

protected void btnSearchSSN_Click(object sender, EventArgs e)
  
      pnlSSNLookup.Visible = false;
      this.pnlSSNEntry.Visible = true;
  
  protected void btnSSN_Click(object sender, EventArgs e)
  
      pnlSSNEntry.Visible = false;
      this.pnlSSNLookup.Visible = true;

  

希望它能为您提供所需的结果。