c# - Implement-Bootstrap-Carousel-slide-from-database-using-Repeater-control-in-ASPNet -
i using bootstrap carousel slider script inside repeater not working proper.the data display @ once , stack horizontal ,when click next or previous in carousel control, carousel displays correctly 1 item in every carousel want display 3 items in each carousel .
<!-- begin carousel --> <div class="row"> <div id="realto-carousel-afee" class="carousel slide"> <div class="carousel-navigation pull-right"> <a class="serif italic pull-left view-all-carousel" href="properties-grid-layout-2">عرض الكل</a> <a class="left carousel-control pull-left" href="#realto-carousel-afee" data-slide="prev"><i class="fa fa-angle-left"></i></a> <a class="right carousel-control pull-right" href="#realto-carousel-afee" data-slide="next"><i class="fa fa-angle-right"></i></a> </div> <div class="carousel-inner"> <asp:repeater runat="server" id="projectsrepater"> <itemtemplate> <div <%# container.itemindex == 0 ? "active" : "" %>> <div class="col-lg-4 col-md-4 col-sm-4 col-sx-12"> <div class="box-container"> <div class="holder"> <a class="overlay" href="" title=""> <span class="more"> <i class="fa fa-zoom-in"></i> </span> <div class="prop_img"> <img width="370" height="210" src="150w" sizes="(max-width: 370px) 100vw, 370px" /> </div> </a> <span class="prop-tag">للبيع</span> <div class="prop-info"> <h3 class="prop-title"> <asp:label id="projid" runat="server" visible="false" text='<%# eval("id")%>'></asp:label> <asp:label text='<%# eval("projectname")%>' id="lblprojname" runat="server"><a href="/">مشروع 94 حي اللوتس الشمالية 2</a></asp:label> </h3> <ul class="more-info clearfix"> <li class="info-label clearfix"> <span class="pull-left" style="float:right !important">المساحات</span> <label id="lblarea" runat="server" class="qty pull-right">2</label> </li> <li class="info-label clearfix"> <span class="pull-left" style="float:right !important">نظام السداد</span> <span id="lblpaymentssystem" runat="server" class="qty pull-right">2</span> </li> <li class="info-label clearfix"> <span class="pull-left" style="float:right !important">تاريخ الاستلام</span> <span id="lblreceiveddate" runat="server" class="qty pull-right">2</span> </li> </ul> </div> <!-- prop-info --> </div> <!-- holder --> </div> <!-- box-container --> </div> </div> </itemtemplate> </asp:repeater> <!-- .carousel-inner --> </div> </div> <!--end carousel--> </div>
protected void page_load(object sender, eventargs e) { // repeterdata(); projectsrepater.datasource = getallprojecct(); projectsrepater.databind(); } public class proj { public int id { get; set; } public string projectname { get; set; } } public list<proj> getallprojecct() { list<proj> listproj = new list<proj>(); sqlconnection con = new sqlconnection(system.web.configuration.webconfigurationmanager.connectionstrings["alamarconnectionstring"].connectionstring); sqlcommand com = new sqlcommand("select id,projectname projects", con); con.open(); sqldatareader reader = com.executereader(); while (reader.read()) { proj cnt = new proj(); cnt.id = convert.toint32(reader["id"]); cnt.projectname = convert.tostring(reader["projectname"]); listproj.add(cnt); } return listproj; }
Comments
Post a Comment