Hiii,
I want to add responsive behaviour to Datalist and implement paging in it.
Below are the HTML code of datalist.
<asp:DataList ID="dlBooking" runat="server" RepeatColumns="4" RepeatLayout="Table" Width="100%"
OnItemDataBound="dlBooking_ItemDataBound" OnItemCommand="dlBooking_ItemCommand">
<ItemTemplate>
<div class="col-md-12 col-lg-12" style="padding: 5px; width: 100%">
<div class="panel panel-default pnlhover" style="margin-bottom: 10px;" id="pnlHead" runat="server" >
<div class="panel-heading">
<div class="panel-title">
<div class="row">
<div class="col-md-3 col-lg-4">
<b>
<asp:Label ID="lblRoomID" runat="server" Text='<%# Eval("Id") %>' Visible="false" /></b>
<asp:Label ID="lblRoomNo" runat="server" Text='<%# Eval("Room_No") %>' /></b>
</div>
<div class="col-md-8 col-lg-8">
<b>
<asp:Label ID="lblStatus" runat="server" Text='<%# Eval("Room_Status") %>' /></b>
</div>
</div>
</div>
</div>
<div class="panel-body">
<asp:DataList ID="dlBookingDetails" runat="server" RepeatLayout="Table" Width="100%" ShowHeader="true">
<ItemTemplate>
<div class="form-horizontal">
<div class="form-group">
<table class="table" style="margin-bottom: 0px" runat="server" id="listTable" >
<tr>
<td align="center"><b>Booked From :</b></td>
<td>
<asp:Label ID="lblBookFrom" runat="server" Text='<%# Eval("BookedFrom","{0:dd/MMM/yyyy}") %>' /></td>
</tr>
<tr>
<td align="center"><b>Booked To :</b></td>
<td>
<asp:Label ID="lblBookTill" runat="server" Text='<%# Eval("BookedTill","{0:dd/MMM/yyyy}") %>' /></td>
</tr>
</table>
</div>
</div>
</ItemTemplate>
</asp:DataList>
</div>
<div class="panel-footer">
<asp:LinkButton ID="btnBook" runat="server" Text="Book Now" CssClass="btn-success btn-block btn"></asp:LinkButton>
</div>
</div>
</div>
</ItemTemplate>
</asp:DataList>