Suggest a feature
×

Welcome to TagMyCode

Please login or create account to add a snippet.
0
0
 
0
Language: ASP
Posted by: Mario Lopes
Added: Sep 27, 2018 8:47 AM
Views: 51
Tornar uma listView com bootstrap responsive
  1. <!DOCTYPE html>
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head runat="server">
  5.     <title></title>
  6.     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous" />
  7. </head>
  8. <body>
  9.     <form id="form1" runat="server">
  10.         <div>
  11.             <div class="container">
  12.                 <div class="row">
  13.                     <div class="col-md-12">
  14.                         <asp:ListView ID="ListView1" runat="server" GroupPlaceholderID="groupPlaceHolder1" ItemPlaceholderID="itemPlaceHolder1" GroupItemCount="5" DataSourceID="SqlDataSource1">
  15.                             <EmptyDataTemplate>
  16.                                 <table runat="server" style="">
  17.                                     <tr>
  18.                                         <td>Não foram devolvidos dados.</td>
  19.                                     </tr>
  20.                                 </table>
  21.                             </EmptyDataTemplate>
  22.                             <LayoutTemplate>
  23.                                 <div class="row text-center">
  24.                                     <asp:PlaceHolder runat="server" ID="groupPlaceHolder1"></asp:PlaceHolder>
  25.                                 </div>
  26.                             </LayoutTemplate>
  27.                             <GroupTemplate>
  28.                                 <div class="row text-center screenwidth">
  29.                                     <asp:PlaceHolder runat="server" ID="itemPlaceHolder1"></asp:PlaceHolder>
  30.                                 </div>
  31.                             </GroupTemplate>
  32.                             <ItemTemplate>
  33.                                 <div class="col-md-2" style="background-color: aqua;">
  34.                                     <asp:Label ID="Label1" runat="server" Text="Exemplo"></asp:Label>
  35.                                 </div>
  36.                             </ItemTemplate>
  37.                         </asp:ListView>
  38.                     </div>
  39.                 </div>
  40.                 <div class="row">
  41.                     <div class="col-md-6">coluna 1</div>
  42.                     <div class="col-md-6">coluna 2</div>
  43.                 </div>
  44.             </div>
  45.         </div>
  46.         <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>" ProviderName="<%$ ConnectionStrings:ConnectionString.ProviderName %>" SelectCommand="select * from bboutros"></asp:SqlDataSource>
  47.         <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
  48.         <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
  49.         <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
  50.         <script>
  51.             $(function () {
  52.                 $(".screenwidth").css('width', screen.width);
  53.             })
  54.         </script>
  55.     </form>
  56. </body>
  57. </html>