BlogAsp.Net Jquery Haber Manşeti Yapımı
Asp.net ve jquery kullanarak dinamik manşet nasıl yapılır bu konu kısa bir zaman önce bana gerekli olmuştu.Ama ben araştırma yaparken dikkat ettim çok fazla döküman göremedim ve kendim neden yayınlamıyorum dedim ve işte şimdi umarım faydalı olacak şekilde birşeyler göstermeye çalışacağım.
İlk önce sayfamıza aşağı da yazdığım kodları ekleyelim hem css imizi hemde js dosyalarımızı sayfamıza adapde edelim.
<link rel=”stylesheet” type=”text/css” href=”http://demo.webdeveloperplus.com/featured-content-slider/style.css” />
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js”></script>
<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.min.js”></script>
<script type=”text/javascript”>
$(document).ready(function() {
$(“#featured > ul”).tabs({ fx: { opacity: “toggle”} }).tabs(“rotate”, 5000, true);
});
</script>
geldik şimdi işin en kolay kısmına 
şimdi 2 adet repeater ekleyeceğiz.Bunlardan birisi manşetimizi sağ tarafda ufak bir resim ile göstericek 2.repeater ise büyük resim ve yine aynı şekilde haber başlığımızı çekip link vereceğiz.
Aspx Dosyamıza aşağıda ki kodları yazıyoruz.
<div id=”featured” >
<ul>
<asp:Repeater ID=”header” runat=”server”>
<ItemTemplate>
<li id=”nav-fragment-<%#Container.ItemIndex +1 %>”><a href=”#fragment-<%#Container.ItemIndex +1 %>”>
<img src='<%#Eval(“Resim”) %>’ alt=”” width=80 height=50 /><span><%#Eval(“Baslik”).ToString() %></span></a></li>
</ItemTemplate>
</asp:Repeater>
</ul>
<!– First Content –>
<asp:Repeater ID=”content” runat=”server”>
<ItemTemplate>
<div id=”fragment-<%#Container.ItemIndex +1 %>” style=””>
<img src='<%#Eval(“Resim”) %>’ width=450 height=250 alt=”” />
<div>
<h2><a href=”HaberGoster.Aspx?HaberID=<%# Eval(“HaberID”).ToString()) %>”><%#Eval(“Baslik”) %></a></h2>
<p><%#Regex.Replace(DataBinder.Eval(Container.DataItem, “Haber”).ToString(), “<(.|\n)*?>”, String.Empty).ToString().Substring(0, 160)%>…</p>
</div>
</div>
</ItemTemplate>
</asp:Repeater>
</div>
.cs Tarafına ise;
private void HaberManset()
{
SqlConnection Baglan = new SqlConnection(ConfigurationManager.ConnectionStrings[“DbConn”].ToString());
SqlCommand cmd;
SqlDataReader dr;
if (Baglan.State == ConnectionState.Closed)
Baglan.Open();
cmd = new SqlCommand(“Select Top 4 HaberID,Baslik,Haber,Resim From Haber Order By HaberID Asc”, Baglan);
SqlDataAdapter da = new SqlDataAdapter(cmd);
DataTable dt = new DataTable();
da.Fill(dt);
header.DataSource = dt;
header.DataBind();
content.DataSource = dt;
content.DataBind();
Baglan.Close();
}
Not: Form load a HaberManset() diyip çağırmayı unutmayın yoksa repeaterin çalışmadığını düşünebilirsiniz
Eğer aşağıda ki resim gibi bir görüntü alıyorsanız işlem tamamdır.Kolay gelsin :))
