Member 8583441 Ответов: 0

Bootstrap 4.1.3 CSS для tab-контента не работает должным образом


I have dynamic unordered list binding from the database and that list is given the tab-content dynamically in aspx page itself. In that binding is done perfectly but not displaying at run time. This data is binding from nested repeaters concept in asp.net. Outer repeater is binded to unordered list and the inner repeater is binded to tab-content. this application is to design online examination. Now my problem when i click the anchor href value the tab-content is not displayed also the first tab is not displaying because there is no active class. If anybody help me to set active for this issue and i want to display the tab-content from the inner repeater binding. The href value is stored in code behind purpose is to remove white space and if there is any capital letters assigning lower to the string. That value is passed to the div class tab-pane. And also if i remove the tab-pane class of div completely the tab-content is displayed but all the contents are displayed. How to stop that these are issues i am facing now.

Что я уже пробовал:

<asp:Repeater ID="rptCustomers" runat="server" OnItemDataBound="OnItemDataBound">
     <HeaderTemplate>
         <table border="0">                                    
     </HeaderTemplate>
     <ItemTemplate>
         <tr>
             <td>
                 <div id="tabs">
                     <ul class="nav nav-tabs flex-column" role="tablist" runat="server">
                         <li style="list-style: none;" class="nav-item" role="tab">
                             <a class="nav-link" href='#<%# Eval("SubjectCategory") %>' data-toggle="tab">
                                 <asp:Label ID="Label2" runat="server" Text='<%# Eval("SubjectCategory") %>'></asp:Label>
                             </a>
                         </li>
                     </ul>
                     <div class="tab-content" id="myTabContent">
                         <div class="tab-pane show" id='<%= ID %>' role="tabpanel">
                             <asp:Repeater ID="rptOuter" runat="server">
                                 <HeaderTemplate>
                                     <table border="0">
                                 </HeaderTemplate>
                                 <ItemTemplate>
                                     <tr>
                                         <td style="padding: 5px;">
                                             <asp:Label ID="lblQuestionNuumber" runat="server" Text='<%# Eval("QuestionNumber") %>'></asp:Label>  <%# Eval("Question") %>
                                         </td>
                                     </tr>
                                     <tr>
                                         <td style="padding: 5px;" class="col-3">
                                             <asp:RadioButton ID="rb1" runat="server" GroupName="Choices" />
                                             A)<asp:Label ID="lblChoiceA" runat="server" Text='<%# Eval("ChoiceA") %>' AssociatedControlID="rb1"></asp:Label>
                                         </td>
                                         <td style="padding: 5px;" class="col-3">
                                             <asp:RadioButton ID="rb2" runat="server" GroupName="Choices" />
                                             B)<asp:Label ID="lblChoiceB" runat="server" Text='<%# Eval("ChoiceB") %>' AssociatedControlID="rb2"></asp:Label>
                                         </td>
                                         <td style="padding: 5px;" class="col-3">
                                             <asp:RadioButton ID="rb3" runat="server" GroupName="Choices" />
                                             C)<asp:Label ID="lblChoiceC" runat="server" Text='<%# Eval("ChoiceC") %>' AssociatedControlID="rb3"></asp:Label>
                                         </td>
                                         <td style="padding: 5px;" class="col-3">
                                             <asp:RadioButton ID="rb4" runat="server" GroupName="Choices" />
                                             D)<asp:Label ID="lblChoiceD" runat="server" Text='<%# Eval("ChoiceD") %>' AssociatedControlID="rb4"></asp:Label>
                                         </td>
                                     </tr>
                                 </ItemTemplate>
                                 <FooterTemplate>
                                     </table>
                                 </FooterTemplate>
                             </asp:Repeater>
                         </div>
                     </div>
                 </div>
                 <asp:HiddenField ID="hfCustomerId" runat="server" Value='<%# Eval("SubjectCategory") %>' />
             </td>
         </tr>
     </ItemTemplate>
     <FooterTemplate>
         </table>
     </FooterTemplate>
</asp:Repeater>

Member 8583441

теперь я могу установить активный класс для этой проблемы используя эту ссылку я уменьшил эту ошибку установив активный класс https://www.aspforums.net/Threads/190546/Implement-Bootstrap-Carousel-Image-Gallery-from-database-using-Repeater-control-in-ASPNet/

Member 8583441

Но содержимое оставшихся вкладок не отображается, когда я нажимаю на следующую вкладку. А также я хочу, чтобы следующий был открыт с помощью asp.net нажмите кнопку любой желающий может помочь мне разобраться в этой проблеме

0 Ответов