Question

我在Repeater中使用Bootstrap轮播滑块脚本，但它不能正常工作。数据立即显示并堆叠水平，当我在轮播控件中单击NEXT或PREVIOUS时，轮播正确显示但每个轮播只有一个项目我想在每个轮播中显示3个项目。

<!-- 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 from 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;
}

实施-引导传送带-滑动从数据库-使用-中继器控制功能于ASPNET

0 个答案: