1
\$\begingroup\$

This produces tabbed tables. Here's how it looks:

enter image description here

Each table displays comments of E-commerce products. The variable dtProductComments is DataTable. The other variables are self explaining.

 <%if (dtProductComments.Rows.Count > 0)
  { %>
<div class="margin-top-20">
    <ul class="nav nav-tabs">
        <li class="active"><a data-toggle="tab" href="#posComments">Positive Comments</a></li>
        <li><a data-toggle="tab" href="#negComments">Negative Comments</a></li>
    </ul>

    <div class="tab-content">

        <div id="posComments" class="tab-pane fade in active">

            <div class="panel-group">

                <%
      foreach (System.Data.DataRow drw in dtProductComments.Rows)
      {
          string srClass = drw["cl_AutoCommentClass"].ToString();
          if (srClass == "1")
              continue;
          string srTitle = drw["cl_CommentTitle"].ToString();
          string srPos = drw["cl_CommentPositiveSection"].ToString();
          string srNeg = drw["cl_CommentNegativeSection"].ToString();
          string srRest = drw["cl_CommentRest"].ToString();          

                %>

                <div class="panel panel-default">

                    <% if (srTitle != "null")
                       { %>
                    <div class="panel-heading"><%:srTitle %></div>
                    <%} %>

                    <%
          if (srPos != "null" || srNeg != "null" || srRest != "null")
          {
                    %>
                    <div class="panel-body">
                        <%                            
              if (srPos != "null")
              {               
                        %>
                        <p><span class="glyphicon glyphicon-thumbs-up" />&nbsp;<%:srPos %></p>
                        <%} %>

                        <%                              
              if (srNeg != "null")
              {                   
                        %>
                        <p><span class="glyphicon glyphicon-thumbs-down" />&nbsp;<%:srNeg %></p>
                        <%} %>

                        <%                            
              if (srRest != "null")
              {                       
                        %>
                        <p><%:srRest %></p>
                        <%} %>
                    </div>
                    <%} %>
                </div>
                <%  } %>
            </div>

        </div>

        <div id="negComments" class="tab-pane fade">
            <div class="panel-group">

                <%
      foreach (System.Data.DataRow drw in dtProductComments.Rows)
      {
          string srClass = drw["cl_AutoCommentClass"].ToString();
          if (srClass == "2")
              continue;
          string srTitle = drw["cl_CommentTitle"].ToString();
          string srPos = drw["cl_CommentPositiveSection"].ToString();
          string srNeg = drw["cl_CommentNegativeSection"].ToString();
          string srRest = drw["cl_CommentRest"].ToString();

                %>

                <div class="panel panel-default">

                    <% if (srTitle != "null")
                       { %>
                    <div class="panel-heading"><%:srTitle %></div>
                    <%} %>

                    <%
          if (srPos != "null" || srNeg != "null" || srRest != "null")
          {
                    %>
                    <div class="panel-body">
                        <%             
              if (srPos != "null")
              {          
                        %>
                        <p><span class="glyphicon glyphicon-thumbs-up" />&nbsp;<%:srPos %></p>
                        <%} %>

                        <%                           
              if (srNeg != "null")
              {                     
                        %>
                        <p><span class="glyphicon glyphicon-thumbs-down" />&nbsp;<%:srNeg %></p>
                        <%} %>

                        <%  
              if (srRest != "null")
              {                           
                        %>
                        <p><%:srRest %></p>
                        <%} %>
                    </div>
                    <%} %>
                </div>
                <%  } %>
            </div>
        </div>
    </div>
</div>
<%} %>
\$\endgroup\$

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.