Asp.Net
04
Oca
2012
Asp.Net jQuery Accordion Haber
Kategori : Asp.NetjQueryCssAccess
Ekleyen : Admin
Merhaba Arkadaşlar, Kısa bir aradan sonra yeni bir makale ile karşınızdayım. Bu yazımı Bloğumda en çok izlenen Makale olan - Asp.Net jQuery Haber Script - 'e alternatif olarak eklemeyi düşündüm umarım faydalı olur. Yazımdan kısaca bahsedecek olursak Access Veritabanından aldığı verileri Accordion Şeklinde hazırlanmış olan, jQuery Easy Accordion Plugin Script'ine yükleyeceğiz. Scriptimizi aşağıdaki adresten indirebilirsiniz.
jQuery Plugin: Easy Accordion
Veritabanımız.
jQuery kodları.
   1:  $(document).ready(function () {
   2:      $('#accordion-1').easyAccordion({ 
   3:              autoStart: true, 
   4:              slideInterval: 3000,
   5:              slideNum:true    
   6:      });
   7:  });
Default.aspx
   1:  <div class="sample">
   2:   
   3:      <h1>Asp.Net Accordion Haber</h1>
   4:   
   5:      <div id="accordion-1">
   6:          <dl>
   7:   
   8:          <asp:Repeater ID="Repeater1" runat="server">
   9:          <ItemTemplate>
  10:              <dt><%#Eval("HaberBaslik") %></dt>
  11:              <dd><h2><%#Eval("HaberBaslikSayfa")%></h2>
  12:                  <p>
  13:                  <img src="images/monsters/<%#Eval("HaberResim") %>" alt="<%#Eval("HaberBaslikSayfa") %>" />
  14:                  <%#Eval("HaberIcerik") %><br />
  15:                  <a href="#" class="more">Devamını oku...</a>
  16:                  </p>
  17:              </dd>
  18:          </ItemTemplate>
  19:          </asp:Repeater>
  20:   
  21:          </dl>
  22:      </div>
  23:   
  24:      <div style="clear:both; line-height:15px; height:0; visibility:hidden; display:block;"></div>
  25:   
  26:      <h1>jQuery Easy Accordion Plugin</h1>
  27:   
  28:  </div>
Default.aspx.cs kodlarımız, standart bir connection nesnesi oluşturduk ve verilerimizi DataReader ile DataTable nesnesi üzerine aldık, DataTable nesnesinide sayfada oluşturuğumuz Repeater nesnemizin DataSource özelliğine verdik :)
   1:  protected void Page_Load(object sender, EventArgs e)
   2:  {
   3:      OleDbConnection con = new OleDbConnection(ConfigurationManager.ConnectionStrings["habercon"].ConnectionString);
   4:      OleDbCommand cmd = new OleDbCommand("Select Top 6 * From Haberler order by HaberId asc", con);
   5:   
   6:      con.Open();
   7:   
   8:      OleDbDataReader dr = cmd.ExecuteReader();
   9:      DataTable tablo = new DataTable();
  10:      tablo.Load(dr);
  11:   
  12:      Repeater1.DataSource = tablo.DefaultView;
  13:      Repeater1.DataBind();
  14:   
  15:      dr.Close();
  16:      con.Close();
  17:  }
Gördüğünüz gibi çok basit fakat bir Web Sitesinde çok şık duracak bir haber modülü karşımıza çıktı.
Başka bir Makalede Görüşmek dileğiyle, sağlıcakla kalın.

Örnek Proje : Asp.Net Accordion Haber
04 Nisan Çar, 2012 hüseyin kamar
paylaşım için tşkler
04 Nisan Çar, 2012 Admin
Rica ederim, faydalı olduysam ne mutlu bana.
28 Mayıs Pzt, 2012 Emrah ÖNAY
Güzel bir çalışma olmuş. Tebrikler...
30 Mayıs Çar, 2012 Zekeriya ALAN
Teşekkürler Emrah,
09 Haziran Cmt, 2012 levent turgut
merhaba, uzun zamandır aradığım bir konuydu, çok teşekkür ederim, ellerinize sağlık. sadece küçük bir sorum olacak, slider için masterpage kullanmışsınız, ben masterpage kullanmıyorum, masterpage kullanılmayan sayfa için nasıl bir değişiklik yapılabilir? slideri ana sayfaya eklemeye çalışıyorum, işin içine masterpage girince tüm sayfa dağılıyor.
10 Haziran Paz, 2012 Admin
Teşekkür ederim, Masterpage kullanmıyorsanız masterpagede bulunan javascript ve css bildirimlerini kullanacağınız sayfaya eklemeniz yeterli, o şekilde problemsiz kullanabilirsiniz.
iyi çalışmalar.
06 Mart Çar, 2013 kasım can
bunu iç içe repeater kullanarak yapmayı denedim ama, css kalıbına sokunca hepsi gözükmüyordu?, şimdi iş bunun mantığını biraz kavramakta.
06 Mart Çar, 2013 Admin
iç içe repeater kullanmandaki amaç nedir? yardımcı olmaya çalışayım.