asp.net slider

Question

Hello friends, this is how it fills with data from the database.

I want to add photo under each data

each filled data can have more than one picture how can i do this

<asp:DataList ID="DataList3" runat="server" DataSourceID="SqlDataSource2" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" HorizontalAlign="Center" RepeatColumns="1" RepeatDirection="Horizontal">
                <ItemTemplate>
                    <div class="container">
                        <div class="row row-30">
                            <div class="col-lg-6">
                                <div class="block-decorate-img wow fadeInLeft" data-wow-delay=".2s">
                                    <video class="controlvideo2" src="../video/<%# Eval("Video") %>" autoplay loop playsinline muted width="570" height="500"></video>

                                </div>
                            </div>
                            <div class="col-lg-1"></div>
                            <div class="col-lg-5 col-12">
                                <div class="block-sm offset-top-45">
                                    <h3 class="" data-wow-delay=".3s"><%# Eval("SirketAdi") %></h3>
                                    <p class="offset-xl-40 wow fadeInUp" data-wow-delay=".4s" style="font-size: 15px"><%# Eval("SirketAciklama") %></p>
                                    <a class="button-width-190 button-primary button-circle button-lg button offset-top-30" href="<%# Eval("link") %>" target="_blank"><%# Eval("SirketAdi") %></a>
                                    <br />
                                    <br />
                                </div>
                            </div>
                        </div>
                        <div class="section-name bayilerH3" data-wow-delay=".2s">
                            <h3>Bayilerimiz</h3>
                        </div>


                    </div>
                </ItemTemplate>
            </asp:DataList>

Answer 1

I searched for an example about this but couldn't find anything.

Answer 2

Hi @kadir koçaslan,

Depending on your needs, you can add a new div under the div of your data property to place the image. You can also set a CSS style to complete the functionality.

Code:

<style type="text/css">              .box1{                 width: 200px;                 height: 100px;                 background-color: #ffffff;                             } <asp:DataList ID="DataList3" runat="server" DataSourceID="SqlDataSource2" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" HorizontalAlign="Center" RepeatColumns="1" RepeatDirection="Horizontal">                 <ItemTemplate>                     <div class="container">                         <div class="row row-30">                             <div class="col-lg-6">                                 <div class="block-decorate-img wow fadeInLeft" data-wow-delay=".2s">                                     <video class="controlvideo2" src="../video/<%# Eval("Video") %>" autoplay loop playsinline muted width="570" height="500"></video>                                  </div>                             </div>                             <div class="col-lg-1"></div>                             <div class="col-lg-5 col-12">                                 <div class="block-sm offset-top-45">                                     <h3 class="" data-wow-delay=".3s"><%# Eval("SirketAdi") %></h3>                                     <p class="offset-xl-40 wow fadeInUp" data-wow-delay=".4s" style="font-size: 15px"><%# Eval("SirketAciklama") %></p>                                     <a class="button-width-190 button-primary button-circle button-lg button offset-top-30" href="<%# Eval("link") %>" target="_blank"><%# Eval("SirketAdi") %></a>                                    <div class="box1">                                    <img src="img1" />                                    <img src="img2" />                                      <img src="img3" />                                     .......                                    </div>                                     <br />                                     <br />                                 </div>                             </div>                         </div>                         <div class="section-name bayilerH3" data-wow-delay=".2s">                             <h3>Bayilerimiz</h3>                                               </div>                       </div>                                 </ItemTemplate>             </asp:DataList>

<style type="text/css">

            .box1{

                width: 200px;

                height: 100px;

                background-color: #ffffff;

            }

<asp:DataList ID="DataList3" runat="server" DataSourceID="SqlDataSource2" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" HorizontalAlign="Center" RepeatColumns="1" RepeatDirection="Horizontal">

                <ItemTemplate>

                    <div class="container">

                        <div class="row row-30">

                            <div class="col-lg-6">

                                <div class="block-decorate-img wow fadeInLeft" data-wow-delay=".2s">

                                    <video class="controlvideo2" src="../video/<%# Eval("Video") %>" autoplay loop playsinline muted width="570" height="500"></video>

                                </div>

                            </div>

                            <div class="col-lg-1"></div>

                            <div class="col-lg-5 col-12">

                                <div class="block-sm offset-top-45">

                                    <h3 class="" data-wow-delay=".3s"><%# Eval("SirketAdi") %></h3>

                                    <p class="offset-xl-40 wow fadeInUp" data-wow-delay=".4s" style="font-size: 15px"><%# Eval("SirketAciklama") %></p>

                                    <a class="button-width-190 button-primary button-circle button-lg button offset-top-30" href="<%# Eval("link") %>" target="_blank"><%# Eval("SirketAdi") %></a>

                                   <div class="box1">

                                   <img src="img1" />

                                   <img src="img2" />

                                     <img src="img3" />

                                    .......

                                   </div>

                                    <br />

                                    <br />

                                </div>

                            </div>

                        </div>

                        <div class="section-name bayilerH3" data-wow-delay=".2s">

                            <h3>Bayilerimiz</h3>

                        </div>

                    </div>

                </ItemTemplate>

            </asp:DataList>

I made an example for your reference：

If you have new needs, you can leave me a message. Glad to help you.

Best Regards

Qi You

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

---