Asp.Net (c#) basit blog yapımının bu bölümünde; veritabanında bulunan konuların contentPlaceHolder içerisinde listelenmesi ve konuların farklı sayfada görüntülenmesini sağlayarak sitemizi tamamlayacağız.

Asp.Net (c#) basit blog yapımı - bölüm 2

1. Databasedeki konuları listeleme

Blog sitemiz için yeni bir web form ekleyip adını anasayfa.aspx olarak belirliyoruz ve masterpage bağlayarak kaydediyoruz. Oluşturduğumuz sayfanın " design " görünümünde iken " Datalist " ekleyip aşağıda verilen görseldeki gibi " ItemTemplate " hazırlıyoruz. Eğer design sekmesinde hazırlayamıyorsanız kod görümüne geçip kodları yazarakta hazırlayabilirsiniz.

contentplaceholder içerisine datalist ekleme

anasayfa.aspx sayfasının kod kısmı ise aşağıdaki gibi olacaktır. Yazılan kodlar contentPlaceHolder içerisinde bulunmalıdır.

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
  // konu başlığının title etiketlerinde görüntülenmesi için
  <%#Eval("baslik") %>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="head" Runat="Server">
  // head etiketleri arasına alt sayfadan bir şey göndermek için kullanabilirsiniz.
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
 <asp:DataList ID="DataList1" runat="server" Width="400px">
   <ItemTemplate>
     <div class="kutu">
     <h1><%#Eval("baslik") %></h1>
     <img src="resim/<%#Eval("resim") %>" />
     
     <p><%#Eval("ozet") %></p>
     <p>
     <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl='<%# string.Format("~/Default3.aspx?id={0}", Eval("kimlik")) %>'>Devamını oku...</asp:HyperLink>
     </p>
     <div class="temiz"></div>
    </div>
   </ItemTemplate>
 </asp:DataList>
</asp:Content>

string.Format komutu string türündeki ifadeleri biçimlendirerek yeniden yazdırmak için kullanılır. Burda ise her bir konuya ait id'leri devamını oku linkine bağlamak ve tıklandığında diğer sayfada hangi konunun görüntüleneciği bilgisini diğer sayfaya aktarmaktır.

Sayfanın görümünü tamamladıktan sonra anasayfa.aspx'in Page_Load olayına aşağıdaki kodları ekleyerek listeleme işlemini sonlandırıyoruz.

//using satırlarının altına aşağıdaki iki satırı ekleyin
using System.Data;
using System.Data.OleDb;

OleDbConnection baglan = new OleDbConnection("Provider=Microsoft.ACE.OLEDB.12.0;Data Source=" + Server.MapPath("App_Data\\bloglar.accdb"));
baglan.Open();

// aşağıdaki sorguda * yerine alan isimleriylede kullanabiliriz.
OleDbCommand satir = new OleDbCommand("SELECT * FROM blog", baglan);
IDataReader oku = satir.ExecuteReader();

 DataTable dtkonu = new DataTable("blog");
 dtkonu.Load(oku);

 // Datalist içerisine bilgi aktarımı yapılıyor
 DataList1.DataSource = dtkonu;
 DataList1.DataBind();

Tüm işlemler tamamlandıktan sonra anasayfa.aspx sayfasını görüntülediğimizde aşağıdaki gibi bir ekran çıktısını görmeliyiz.

asp.net blog yapımı anasayfası

Bu görüntü ile anasayfa ile ilgili herşey tamamlanıyor. Eğer hata lıyorsak yukardaki işlemlerin tekrar kontorolünü yapınız.

2. Tek konu görüntüleme

Anasayfamız da konu listesini elde edip herbir konu için devamını oku bağlantılarını oluşturduk. Bağlantılar aracılığıyla id'leri de yeni ekleyeceğimiz sayfaya gönderecek duruma geldik. Bağlantısına tıkladığımız konunun görüntülenmesi için yeni bir web form eklemesi yapalım ve sayfaya hyperLink içerisinde hangi sayfa ismini kullandıysak o ismi atıyoruz. Konu görüntülemek için yeni eklediğimiz sayfanın design görünümünde iken yeni bir " DataList " ekleyip " ItemTemplate " ayarlamasını aşağıdaki görsele göre yapalım. Eğer yapamıyorsanız datalist ekledikten sonra kod bölümüne geçip gerekli düzenlemeleri yapıyoruz.

konu içeriği görüntüleme datalisti

DataList eklediğimiz bu sayfanın kod bölümüne geçerek aşağıdaki kodları ekleyiyoruz. Bu sayfa Server.HtmlDecode kodunu kullanıyoruz. Amacı veritabanımıza html kodlarıyla eklenen konu metni encode edilerek kaydediliyor. Encode halinde bulunan html kodlarının sayfa görüntülenirken &lt; gibi görüntülenmemesi için Server.HtmlDecode kodunu ekliyoruz.

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder2" Runat="Server">
// title bölümüne konu başlığının aktarılması için
<%#Eval("baslik") %>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
 <asp:DataList ID="DataList1" runat="server" Width="400px">
   <ItemTemplate>
    <h1><%#Eval("baslik") %></h1>
    <div class="resim">
       <img src="resim/<%#Eval("resim") %>" />
    </div>
    <%# Server.HtmlDecode(Eval("bmetin").ToString()) %>
   </ItemTemplate>
 </asp:DataList>
</asp:Content>

Bu sayfanın Page_Load olayına ise aşağıdaki kodları ekliyoruz. Bu sayfada Request.String koduyla bir önceki sayfadan gelen id bilgisini çekmek için kullanıyoruz. Buradan gelen bilgi string olduğundan dolayı string bir değişkende gelen id değerini tutuyoruz.

//using satırlarının altına aşağıdaki iki satırı ekleyin
using System.Data;
using System.Data.OleDb;


string id = Request.QueryString["id"];

OleDbConnection baglan = new OleDbConnection("Provider=Microsoft.ACE.OLEDB.12.0;Data Source=" + Server.MapPath("App_Data\\bloglar.accdb"));
baglan.Open();

OleDbCommand satir = new OleDbCommand("SELECT * FROM blog where kimlik =" + id, baglan);
IDataReader oku = satir.ExecuteReader();

 DataTable konu = new DataTable("blog");
 konu.Load(oku);

 // Datalist bilgi aktarması yapılıyor
 DataList1.DataSource = konu;
 DataList1.DataBind();

Listenen konulardan sonra "devamını oku..." bağlantısına tıklandığında aşağıdaki görüntüyle karşılaşıp blog yapımını sonlardırmış olacağız.

asp.net blog yapımı konu detayı

  • Yazı Etiketleri :
  • databasede bulunan verileri contentplaceholderda görüntüleme
  • datalist kullanımı
  • itemtemplate kullanımı
  • hyperlink kullanımı
Fare tıklamasını takip eden nesne - AS2 ile
Yazıyı Oku

Fare tıklamasını takip eden nesne - AS2 ile

play() ve stop() komutları - AS2 ile
Yazıyı Oku

play() ve stop() komutları - AS2 ile

startDrag ve stopDrag kullanımı - AS3 ile
Yazıyı Oku

startDrag ve stopDrag kullanımı - AS3 ile

3 boyutlu nesne döndürme - AS3 ile
Yazıyı Oku

3 boyutlu nesne döndürme - AS3 ile

gotoAndPlay ve stop kullanımı - action script ile
Yazıyı Oku

gotoAndPlay ve stop kullanımı - action script ile

Güneş çevresinde dönen dünya - kılavuz katman ile
Yazıyı Oku

Güneş çevresinde dönen dünya - kılavuz katman ile

Menu