استخدام slideshow لعرض المعلومات من قاعدة البيانات

السلام عليكم

اعتقد افضل شيء لهذا الامر هو استخدم اداة Repeater بحيث تحصل على ماتريد بالضبط مثال

مثلا نريد استخدام Easy Slider وهو مشهور في هذا المجال بحيث نريد الحصول على الكود التالي:

<div id="slider">
		<ul>				
			<li><a href="http://templatica.com/preview/30"><img src="images/01.jpg" alt="Css Template Preview" /></a></li>
			<li><a href="http://templatica.com/preview/7"><img src="images/02.jpg" alt="Css Template Preview" /></a></li>
			<li><a href="http://templatica.com/preview/25"><img src="images/03.jpg" alt="Css Template Preview" /></a></li>
			<li><a href="http://templatica.com/preview/26"><img src="images/04.jpg" alt="Css Template Preview" /></a></li>
			<li><a href="http://templatica.com/preview/27"><img src="images/05.jpg" alt="Css Template Preview" /></a></li>			
		</ul>
	</div>

في asp.net

نستخدم اداة Repeater

<asp:Repeater runat="server" ID="lstFavCust"   >
   <HeaderTemplate>
   <div id="slider">
		<ul>	

   </HeaderTemplate>
   <FooterTemplate> 	</ul>
	</div>  </FooterTemplate>
        <ItemTemplate> 

		<li>
            <asp:HyperLink NavigateUrl= '<%# Eval("url")  %>'  runat="server"  >

            <asp:Image ImageUrl='<%# Eval("imgurl")  %>' runat="server" />
		</asp:HyperLink>
            </li>	       

        </ItemTemplate>

     </asp:Repeater>

أشكر أخي طارق على ردك .. ولعلي ما قصدته هو كما في كثير من المواقع كموقع العربية مثلا .. شاهد الصورة .. فقد عجزت أن اجعل السلايد يقرأ مباشرة من قاعدة البيانات بنفس انموذج الصورة

المفروض انها نفس الفكرة فانا في المثال السابق استخدمت easy slider .

لذا انصحك اولا بشتغيل السلايدر في صفحة asp.net دون استخدام قاعدة البيانات بعد ذلك حاول الانتقال الى قاعدة البيانات .

وكذلك ارجو وضع مصدر السلايدر المستخدم عندك او وضع الكود الذي تود الحصول عليه لنساعدك في عمل ال Repeater.

أنا حملت المثال الستخدم لدي لكن دون ربطه بقاعدة البيانات لأنني ما عرفت كيف الطريقة ..

فهلا جعلته يقرأ من قاعدة البيانات

ولك كل الشكر

عفوا لم يتم رفع الملف .... هذا هو في المرفقات

SlideShow.rar

السلام عليكم

بالكود التالي تستطيع الوصول الى ماتريد (وقد اكون اوصلتك الى 90% من الحل)

كود Markup وتحتاج الى نغيير اسماء الحقول حسب الموجود في قاعدة البيانات

  <div id="featured" >

 <asp:Repeater runat="server" ID="Repeater1"   >
   <HeaderTemplate>
   <div id="slider">
             <ul class="ui-tabs-nav">

   </HeaderTemplate>
   <FooterTemplate>     </ul>
        </div>  </FooterTemplate>
        <ItemTemplate> 
                  <li class="ui-tabs-nav-item" id='<%# "fff-" + Container.ItemIndex   %>'>

            <asp:HyperLink ID="HyperLink1" NavigateUrl= '<%# "#fragment" + Container.ItemIndex  %>'  runat="server"  >

            <asp:Image ID="Image1" ImageUrl='<%# Eval("IMAGE")  %>' runat="server" />



                  <asp:Label Text='<%# Eval("TITLE")  %>' runat="server" />  
                </asp:HyperLink>
            </li>              

        </ItemTemplate>

     </asp:Repeater>    

      <asp:Repeater runat="server" ID="Repeater2"   >

        <ItemTemplate> 

        <div id='<%# "fragment-" + Container.ItemIndex   %>' class="ui-tabs-panel" style="">
		 <asp:Image ID="Image2" ImageUrl='<%# Eval("IMAGE")  %>' runat="server" />
		<div class="info" >
		<h2><asp:HyperLink ID="HyperLink2" NavigateUrl="#"  Text= '<%#  Eval("TITLE")  %>'  runat="server"  /></h2>
		<p>       <asp:Label ID="Label2" Text='<%# Eval("TITLE")  %>' runat="server" />   <a href="#" >أقرأ المزيد</a></p>
		</div>
	</div>




        </ItemTemplate>

     </asp:Repeater>    


</div>

والكود للربط مع بيانات وهمية يجب تغييره باستخدام قواعد البيانات

protected void Page_Load(object sender, EventArgs e)
    {
        Repeater1.DataSource = Slider.GetAll();
        Repeater1.DataBind();
  Repeater2.DataSource = Slider.GetAll();
        Repeater2.DataBind();

    }

public class Slider
{
    public int ID { get; set; }
    public string URL { get; set; }
    public string IMAGE { get; set; }
    public string TITLE { get; set; }
    public static List<Slider> GetAll()
    {
        return new List<Slider>
            {
                new Slider { ID = 1, URL = "http://www.example.com" ,IMAGE ="images/1.jpg" ,TITLE="Title1" },
                new Slider { ID = 2, URL = "http://www.example1.com",IMAGE ="images/2.jpg",TITLE="Title2"  },
                new Slider { ID = 3, URL = "http://www.example2.com" ,IMAGE ="images/3.jpg" ,TITLE="Title3" }
            };
    }
}

جزاك الله خيرا .. سأجرب الكود