简体   繁体   English

尝试使用中继器 asp.net web ZAC68B62ABFD6A9FE26E8AC4236CCE8 的动态轮播 slider

[英]Trying dynamic carousel slider using repeater asp.net web forms

Below is my carousel slider inside repeater which is not working.下面是我的转盘 slider 在中继器内部,它不工作。

           <div class="col-md-4">
                  <div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="false">
                  <div class="upload-h4">
                  <h4>Mark Attendance</h4>
                  </div>
                  <div class="carousel-inner">
                  <asp:Repeater ID="Repeater_Attendance" runat="server">

                  <ItemTemplate>
                  <div class="item active">
                   <img src="Trainer_Images/attendance1.jpg" class="img-responsive" alt="">
                  <div class="carousel-caption caption-bg">
                  <div class="row">
                  <div class="col-md-12">
                  <div class="col-md-4">Submitted Date:</div>
                  <div class="col-md-8">01/11/2019</div>
                  <div class="col-md-4">Latitude:</div>
                  <div class="col-md-8">17.4428449</div>
                  <div class="col-md-4">Longitute:</div>
                  <div class="col-md-8">78.47995379999998</div>
                  <div class="col-md-4">Event Type:</div>
                   <div class="col-md-8">Mark Attendance</div>

                  </div>

                  </div>

                  </div>
                 </div>
                 </ItemTemplate>
                 <AlternatingItemTemplate>
                 <div class="item">
                 <img src="Trainer_Images/attendance2.jpg" class="img-responsive" alt="">
                 <div class="carousel-caption caption-bg">
                 <div class="row">
                 <div class="col-md-12">
                <div class="col-md-4">Submitted Date:</div>
                 <div class="col-md-8">02/11/2019</div>
                 <div class="col-md-4">Latitude:</div>
                 <div class="col-md-8">17.4428449</div>
                  <div class="col-md-4">Longitute:</div>
                  <div class="col-md-8">78.47995379999998</div>


                  <div class="col-md-4">Event Type:</div>
                  <div class="col-md-8">Mark Attendance</div>
                  </div>

                  </div>

                   </div>
                </div>
               </AlternatingItemTemplate>

               </asp:Repeater>



                </div>

               <!-- Left and right controls -->
              <a class="left carousel-control" href="#myCarousel" data-slide="prev">
              <span class="glyphicon glyphicon-chevron-left"></span>
             <span class="sr-only">Previous</span>
                </a>
             <a class="right carousel-control" href="#myCarousel" data-slide="next">
             <span class="glyphicon glyphicon-chevron-right"></span>
             <span class="sr-only">Next</span>
             </a>
              </div>
            </div>

Below is my html slider which working fine.下面是我的 html slider 工作正常。

   <div class="col-md-4">
                                 <div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="false">

                                      <div class="upload-h4">
                                         <h4>Mark Attendance</h4>
                                       </div>

                                      <div class="carousel-inner">

                                                        <div class="item active">
                                          <img src="Trainer_Images/attendance1.jpg" class="img-responsive" alt="">
                                          <div class="carousel-caption caption-bg">
                                             <div class="row">
                                               <div class="col-md-12">

                                                   <div class="col-md-4">Submitted Date:</div>
                                                  <div class="col-md-8">01/11/2019</div>

                                                  <div class="col-md-4">Latitude:</div>
                                                  <div class="col-md-8">17.4428449</div>
                                                  <div class="col-md-4">Longitute:</div>
                                                  <div class="col-md-8">78.47995379999998</div>
                                                   <div class="col-md-4">Event Type:</div>
                                                  <div class="col-md-8">Mark Attendance</div>

                                               </div>

                                             </div>

                                           </div>
                                        </div>

                                        <div class="item">
                                          <img src="Trainer_Images/attendance2.jpg" class="img-responsive" alt="">
                                          <div class="carousel-caption caption-bg">
                                             <div class="row">
                                               <div class="col-md-12">
                                                   <div class="col-md-4">Submitted Date:</div>
                                                  <div class="col-md-8">02/11/2019</div>
                                                  <div class="col-md-4">Latitude:</div>
                                                  <div class="col-md-8">17.4428449</div>
                                                  <div class="col-md-4">Longitute:</div>
                                                  <div class="col-md-8">78.47995379999998</div>


                                                   <div class="col-md-4">Event Type:</div>
                                                  <div class="col-md-8">Mark Attendance</div>
                                               </div>

                                             </div>

                                           </div>
                                        </div>


                                      </div>

                                      <!-- Left and right controls -->
                                      <a class="left carousel-control" href="#myCarousel" data-slide="prev">
                                        <span class="glyphicon glyphicon-chevron-left"></span>
                                        <span class="sr-only">Previous</span>
                                      </a>
                                      <a class="right carousel-control" href="#myCarousel" data-slide="next">
                                        <span class="glyphicon glyphicon-chevron-right"></span>
                                        <span class="sr-only">Next</span>
                                      </a>
                                    </div>
                               </div>

I am getting below image output when i will use using repeater but using html working fine.当我将使用中继器但使用 html 工作正常时,我得到下面的图像 output。

在此处输入图像描述

Please help i am trying using repeater for dynamic fetching data of images please help to out this issue thank you very much.请帮助我尝试使用中继器动态获取图像数据请帮助解决这个问题,非常感谢。

To display dynamic data, a repeater must be bound to some sort of data source for that dynamic data, and your code doesn't show where you are doing that.要显示动态数据,必须将转发器绑定到该动态数据的某种数据源,并且您的代码不会显示您在哪里执行此操作。 If you are, you should add that code to your question.如果是,您应该将该代码添加到您的问题中。

If you are not binding to a data source, that's probably why nothing is showing up.如果您没有绑定到数据源,那可能就是什么都没有显示的原因。 Without a data source, no items are ever getting added to the repeater, and the ItemTemplate will never be used, so you won't see any of that content from the ItemTemplate.如果没有数据源,则不会将任何项目添加到转发器,并且永远不会使用 ItemTemplate,因此您将看不到 ItemTemplate 中的任何内容。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM