скрыть / показать поля ввода asp - PullRequest
Новая
       10

скрыть / показать поля ввода asp

0 голосов
/ 04 июня 2018

Я пытаюсь создать веб-форму, где пользователи могут вводить более одной квалификации, я хочу создать кнопку добавления дополнительной информации и пытаюсь сделать это, скрывая некоторые поля ввода, которые затем будут отображаться принажата кнопка, что является лучшим способом сделать это, это мой код asp на данный момент 

<div class="tab-pane" id="four">
   <h2>Qualifications</h2>
   <br />
   <asp:Label runat="server" ID="lblQualSubject" AssociatedControlID="ddlQualSubject" CssClass="Emlabel"> Qualification Subject/Code: </asp:Label><asp:DropDownList ID="ddlQualSubject" runat="server" CssClass="Eminput"/>
   <br />
   <asp:Label runat="server" ID="lblQualYear" AssociatedControlID="txtQualYear" CssClass="Emlabel"> Qualification Year: </asp:Label><asp:TextBox ID="txtQualYear" runat="server" CssClass="Eminput" />
   <br />
   <asp:Label runat="server" ID="lblQualGrade" AssociatedControlID="txtQualGrade" CssClass="Emlabel"> Qualification Grade: </asp:Label><asp:TextBox ID="txtQualGrade" runat="server" CssClass="Eminput" /><br />
   <br />
   <asp:Label runat="server" ID="lblQualSubject2" AssociatedControlID="ddlQualSubject2" CssClass="Emlabel"> Qualification Subject/Code: </asp:Label><asp:DropDownList ID="ddlQualSubject2" runat="server" CssClass="Eminput"/>
   <br />
   <asp:Label runat="server" ID="lblQualYear2" AssociatedControlID="txtQualYear2" CssClass="Emlabel"> Qualification Year: </asp:Label><asp:TextBox ID="txtQualYear2" runat="server" CssClass="Eminput" />
   <br />
   <asp:Label runat="server" ID="lblQualGrade2" AssociatedControlID="txtQualGrade2" CssClass="Emlabel"> Qualification Grade: </asp:Label><asp:TextBox ID="txtQualGrade2" runat="server" CssClass="Eminput" />
   <br />
   <br />
   <asp:Label runat="server" ID="lblQualSubject3" AssociatedControlID="ddlQualSubject3" CssClass="Emlabel"> Qualification Subject/Code: </asp:Label><asp:DropDownList ID="ddlQualSubject3" runat="server" CssClass="Eminput"/>
   <br />
   <asp:Label runat="server" ID="lblQualYear3" AssociatedControlID="txtQualYear3" CssClass="Emlabel"> Qualification Year: </asp:Label><asp:TextBox ID="txtQualYear3" runat="server" CssClass="Eminput" />
   <br />
   <asp:Label runat="server" ID="lblQualGrade3" AssociatedControlID="txtQualGrade3" CssClass="Emlabel"> Qualification Grade: </asp:Label><asp:TextBox ID="txtQualGrade3" runat="server" CssClass="Eminput" />
   <br />
   <br />
   <asp:Label runat="server" ID="lblQualSubject4" AssociatedControlID="ddlQualSubject4" CssClass="Emlabel"> Qualification Subject/Code: </asp:Label><asp:DropDownList ID="ddlQualSubject4" runat="server" CssClass="Eminput"/>
   <br />
   <asp:Label runat="server" ID="lblQualYear4" AssociatedControlID="txtQualYear4" CssClass="Emlabel"> Qualification Year: </asp:Label><asp:TextBox ID="txtQualYear4" runat="server" CssClass="Eminput" />
   <br />
   <asp:Label runat="server" ID="lblQualGrade4" AssociatedControlID="txtQualGrade4" CssClass="Emlabel"> Qualification Grade: </asp:Label><asp:TextBox ID="txtQualGrade4" runat="server" CssClass="Eminput" />
   <br />
</div>

Любые предложения будут высоко оценены

Ответы [ 2 ]

0 голосов
/ 04 июня 2018

Возможно, Bootstrap Collapse - ваш выбор:

https://getbootstrap.com/docs/4.0/components/collapse/

Вы можете использовать его, чтобы показать / скрыть необязательное значение.

0 голосов
/ 04 июня 2018

Вы можете добавить атрибут стиля Css display:none и удалить его после нажатия кнопки

...