wie man Reagieren DataList asp.net

Habe ich eine Asp.net DataList-Steuerelement in meine Seite. Es ist derzeit mit repeatcolumns set zu 4, die mir 4 Spalten in jeder Zeile. Aber ich will diese reaktionsschnell Weg und setzen Sie den Wert auf 1 für kleinere Bildschirmgrößen. Unten ist meine asp.net Kontrolle:

<asp:DataList runat="server" RepeatDirection="Horizontal" RepeatColumns="4" ID="dd" class="vex-res">

Wie kann ich das erreichen?

Was haben Sie bisher ausprobiert ? Sie soll Postleitzahl. Alle, die du gepostet hast ist ein ASP.NET usercontrol-Erklärung

InformationsquelleAutor newguy | 2014-04-09

Kann man nicht machen, DataList zu reagieren, da macht es als Tabelle.

Stattdessen müssen Sie verwenden ListView mit bootstrap (oder einige andere responsive-framework).

<asp:ListView ID="ListView1" runat="server" ...>
    ...
    <ItemTemplate>
        <div class="row">
            <div class="col-md-4"><%# Eval("Name") %></div>
            <div class="col-md-4"><%# Eval("Email") %></div>
            <div class="col-md-4"><%# Eval("Address") %></div>
        </div>
    </ItemTemplate>
</asp:ListView>

Wie machen Sie diese wiederholen sich horizontal wie die datalist?
Sie müssen nur style es mit CSS. Wenn Sie weitere Informationen benötigen, können Sie Sie erstellen eine neue Frage und poste deinen code?

InformationsquelleAutor Win

Dieser Arbeit My Home :

<asp:DataList ID="dlCustomers" runat="server" RepeatDirection="Horizontal" RepeatLayout="Flow" CssClass="row">
    <ItemTemplate>
   <%-- <div class="row">--%>
    <div class="col-sm-4"><!--THUMBNAIL#2-->
    <div class="panel-body">
      <span class="label label-warning"><%# Eval("status")%></span>
      <div class="thumbnail label-success">
        <asp:Image ID="Image1" runat="server" ImageUrl='<%# "~/" +Eval("image1").ToString().Trim() %>' Width="150px" Height="150px" />
        <div class="caption"><h4>Rp.<small> <%# Eval("harga")%></small></h4>
          <strong><%# Eval("judul") %></strong>
          <p>
          <small>LT:<strong>  <%# Eval("luastanah")%> m2</strong> </small> <small> LB : <strong>  <%# Eval("luasbangunan")%> m2</strong> </small> 
          <small>Setifikat : <strong><%# Eval("sertifikasi")%></strong> </small> <br />
         <small> Kamar : <strong><%# Eval("kamartidur")%></strong> </small><br />
         <small> Kamar Mandi : <strong><%# Eval("kamarmandi")%></strong> </small>
          </p>
          <a href="#" class="btn btn-success">Lihat Details</a>
        </div>
      </div>
     </div>
     </div> 
      <%--</div>--%>
      </ItemTemplate>
</asp:DataList>

Responsive mit bootstrap 3.3.6 ..

Der OP bekam eine Antwort vor 2 Jahren, warum diese post jetzt?
sorry, zu spät ..: D Dieses Jahr war ich in der asp.net.
Genial, es hat mir sehr Geholfen

InformationsquelleAutor Yohan Apriandi

Kommen, um diese ein wenig zu spät, aber ich fand eine asp:repeater, der gut funktioniert und keine zusätzlichen CSS erforderlich, um die layout-Wiederholung horizontal.

    <div class="container">
        <div class="row">
            <asp:Repeater ID="myRepeater" runat="server" DataSourceID="myDataSourceID">
                <ItemTemplate>
                    <div class="col-sm-4">
                        <%# Eval("itemID")%><br />
                        <%# Eval("itmName")%>
                    </div>
                </ItemTemplate>
            </asp:Repeater>
        </div>
    </div>

Mir ist klar, dass dadurch die gesamten Spalten in eine Zeile hinzufügen von bis zu mehr als 12, aber da dies nur wickeln Sie auf der Zeile darunter sollte es nicht wirklich eine Rolle.

Referenz: https://stackoverflow.com/questions/23502342/bootstrap-3-grid-does-it-really-matter-how-many-columns-are-in-a-row

InformationsquelleAutor Simon Tindall

2

Können Sie auch versuchen, die Einstellung RepeatLayout="Flow". Das wird dazu führen, datalist zum Rendern als eine Reihe von <div> - Elemente, die Verhalten sich dementsprechend.

InformationsquelleAutor Shraps

<asp:DataList ID="DataList1" runat="server"  OnItemDataBound="uxPosts_ItemDataBound1" cssClass="row" RepeatLayout="Flow" RepeatDirection="Horizontal">
        <ItemTemplate>
            <div class="col-sm-3 col-md-3 col-lg-3"><%# Eval("Name") %></div>
            <div class="col-sm-3 col-md-3 col-lg-3"><%# Eval("Email") %></div>
            <div class="col-sm-3 col-md-3 col-lg-3"><%# Eval("Address") %></div>
            <div class="col-sm-3 col-md-3 col-lg-3"><%# Eval("Phone") %></div>
        </ItemTemplate>
    </asp:DataList>

Nutzen Sie bitte Englisch. Und es ist normalerweise eine gute form, um Ihre Erklärung in Ihrer Antwort, die eigentlich die Antwort.

InformationsquelleAutor Diablos Rmoreno

    <asp:DataList ID="uxPosts" runat="server"  OnItemDataBound="uxPosts_ItemDataBound1" cssClass="row" RepeatLayout="Flow" RepeatDirection="Horizontal">
        <ItemTemplate>

            <a id="uxLink" runat="server" class="txt_link">
                <div class="col-xs-4 col-sm-4 col-md-4  " style="text-align:center;" >
                    <asp:Label ID="Label2" runat="server" Text='<%# Eval("Descripcion","{0:d}") %>'></asp:Label>  
                </div>

                <div class="col-xs-4 col-sm-4 col-md-4  " style="text-align:center;" >
                    <asp:Label ID="Label1" runat="server"  Text='<%# Eval("Descripcion","{0:d}") %>'></asp:Label>  
                </div>

                <div class="col-xs-4 col-sm-4 col-md-4  " style="text-align:center;" >
                    <asp:Label ID="Label4" runat="server" Text='<%# Eval("Descripcion","{0:d}") %>'></asp:Label>  
                </div>
            </a>

        </ItemTemplate>

    </asp:DataList>

InformationsquelleAutor Diablos Rmoreno

-3

  <asp:DataList ID="uxPosts" runat="server"  OnItemDataBound="uxPosts_ItemDataBound1" cssClass="row" RepeatLayout="Flow" RepeatDirection="Horizontal">
        <ItemTemplate>
            <a id="uxLink" runat="server" class="txt_link">
                <div class=" col-xs-6 col-sm-4 col-md-3 col-lg-3  " style="text-align:center;" >
                    <div class="pnlborde">
                        <div class="encabezadofondo">
                            <asp:Label ID="Label2" runat="server" Height="38px" width="150px" Text='<%# Eval("Descripcion","{0:d}") %>'></asp:Label>  
                        </div>

                        <br />
                        <asp:Image ID="uxImage" runat="server" width="65%"  Height="90%" align="center" />
                        <br /><br />
                    </div>
                    <br />
                </div>
            </a>
        </ItemTemplate>
    </asp:DataList>

InformationsquelleAutor Diablos Rmoreno

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.