newguy newguy - 1 year ago 978
ASP.NET (C#) Question

how to make Responsive DataList asp.net

I have an Asp.net DataList control in my page. It is currently having repeatcolumns set to 4 which will give me 4 columns in each row. But I want to make this responsive and set the value to 1 for smaller screen sizes. Below is my asp.net control:

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


How can I achieve this?

Win Win
Answer Source

You cannot make DataList to be responsive, because it renders as Table.

Instead, you need to use ListView with bootstrap (or some other 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>