{"id":395,"date":"2010-06-24T15:17:55","date_gmt":"2010-06-24T15:17:55","guid":{"rendered":"http:\/\/www.erbugkaya.com\/?p=395"},"modified":"2014-01-16T23:49:56","modified_gmt":"2014-01-16T23:49:56","slug":"dinamik-web-sitesi-bolum-02-database-ve-database-baglantisi","status":"publish","type":"post","link":"http:\/\/erbugkaya.com\/?p=395","title":{"rendered":"Dinamik Web Sitesi – B\u00f6l\u00fcm 02- Database ve Database ba\u011flant\u0131s\u0131"},"content":{"rendered":"

9\/5\/2007<\/em>
\nMerhaba bu makalemde, ilk makalede tasar\u0131m\u0131n\u0131 oturttu\u011fumuz Frp Kitap Merkezi sitesini dinamik hale getirmek i\u00e7in ilk ad\u0131mlar\u0131m\u0131z\u0131 ataca\u011f\u0131z. Bu a\u015famada database olarak Microsoft SQL Server 2005 Express Edition’u kullanaca\u011f\u0131z. SQL Server ile ilgili yard\u0131mlar\u0131 i\u00e7in ekip arkada\u015f\u0131m Behl\u00fcl Behram’a \u00e7ok te\u015fekk\u00fcrler. E\u011fer y\u0131llard\u0131r yapt\u0131\u011f\u0131n\u0131z tasar\u0131mlar\u0131 statik olarak haz\u0131rlamaktan s\u0131k\u0131l\u0131p s\u0131k\u0131l\u0131p s\u00fcrekli bir o dile bir bu dile bula\u015f\u0131p, hi\u00e7 birinden istedi\u011finiz sonucu tam olarak alamad\u0131ysan\u0131z, bir t\u00fcrl\u00fc dinamik web sitesine nereden ba\u015flayaca\u011f\u0131n\u0131z\u0131 bilemediyseniz, internette buldu\u011funuz dok\u00fcmanlar tasar\u0131mc\u0131 olarak sizin bilginizin \u00fcst\u00fcnde idiyse; bu makale dinamik web sitesi yaratmaya ba\u015flamak i\u00e7in iyi bir nokta olacakt\u0131r. Bu makalede SQL Server Express Edition kurulumunu, SQL Express’de database olu\u015fturmay\u0131 ve SQL database’den veri \u00e7ekmeyi anlataca\u011f\u0131m.<\/p>\n


\nBa\u015flayal\u0131m. \u0130lk \u00f6nce database i\u00e7in Microsoft SQL Server Express ve Microsoft SQL Server Management Studio Express’i indirece\u011fiz. Neden MS SQL Express diyecek olursan\u0131z. Her \u015feyden \u00f6nce bedava olduklar\u0131 i\u00e7in diyebilirim. Bunun d\u0131\u015f\u0131nda ASP.NET ile dinamik bir site olu\u015fturacaksak, yine Microsoft’un \u00fcr\u00fcnlerini kullanmak bizi bir s\u00fcr\u00fc dertten kurtaracakt\u0131r.<\/p>\n

Microsoft SQL Server Express’i indirmek i\u00e7in;
\n http:\/\/msdn.microsoft.com\/vstudio\/express\/sql\/download\/<\/a><\/p>\n

Microsoft SQL Server Management Studio Express’i indirmek i\u00e7in;
\n http:\/\/www.microsoft.com\/downloads\/details.aspx?displaylang=en&FamilyID=C243A5AE-4BD1-4E3D-94B8-5A0F62BF7796<\/a><\/p>\n

adreslerini kullanabilirsiniz.<\/p>\n

\u015eimdi kurulumlara ba\u015flayabiliriz. \u0130lk \u00f6nce SQL Server. SQLEXPR32.EXE’ye \u00e7ift t\u0131klay\u0131p, gelen lisans anla\u015fmas\u0131n\u0131 kabul edip Next’e bas\u0131yoruz. Gelen ekranda “Install”‘a basarak devam ediyoruz. Bu kurulumu ba\u015far\u0131yla tamamlay\u0131nca Next ile devam ediyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Tekrar Next.<\/p>\n

\"\"<\/a><\/p>\n

Sisteminiz kontrolden ba\u015far\u0131yla \u00e7\u0131karsa yine Next.<\/p>\n

\"\"<\/a><\/p>\n

Gelen ekranda isim ve \u015firket alanlar\u0131n\u0131 doldurup tekrar Next.<\/p>\n

\"\"<\/a><\/p>\n

Bir \u015fey de\u011fi\u015ftirmeden tekrar Next.<\/p>\n

\"\"<\/a><\/p>\n

SQL’e ba\u011flan\u0131rken nas\u0131l onaylanaca\u011f\u0131n\u0131z\u0131 soran ekranda ben “Windows Authentication Mode” ile devam ediyorum.<\/p>\n

\"\"<\/a><\/p>\n

Bilgisayar sadece bana ait bir g\u00fcvenil sorunum yok bu sebeple “Enable User Instance” ile devam ediyorum.<\/p>\n

\"\"<\/a><\/p>\n

Microsoft’un raporlamalar hakk\u0131nda bilgi istedi\u011fi ekranda karar sizin. Next ile devam.<\/p>\n

\"\"<\/a><\/p>\n

B\u00fct\u00fcn bunlar\u0131n sonucunda SQL y\u00fcklenmeye haz\u0131r. “Install”‘a bas\u0131p devam ediyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Bir s\u00fcre y\u00fckleme ekran\u0131n\u0131 bekledikten sonra her \u015fey yolundaysa Next ile devam ediyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Finish ile bitiriyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Bu i\u015flemler sonucunda bilgisayar\u0131m\u0131za SQL server’\u0131 kurmu\u015f olduk. Ama database olu\u015fturabilmemiz i\u00e7in Microsoft SQL Server Management Studio Express’ide kurmam\u0131z gerekiyor. Ba\u015fl\u0131yal\u0131m.<\/p>\n

SQLServer2005_SSMSEE.msi’a \u00e7ift t\u0131kl\u0131yoruz. \u0130lk gelen ekrandan Next ile devam ediyoruz. S\u00f6zle\u015fme ekran\u0131n\u0131 da kabul edip Next ile devam ediyoruz. Tekrar isim ve \u015firket soran ekran geliyor. Bunlar\u0131da doldurup Next. Nereye ne y\u00fckleyece\u011fini soran ekranda da bir de\u011fi\u015fiklik yapmadan Next.<\/p>\n

\"\"<\/a><\/p>\n

Gelen ekranda Install ile devam ediyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Finish ile kurulumu tamaml\u0131yoruz. B\u00f6ylece SQL Express Edition kullan\u0131ma haz\u0131r. Alttaki gibi program\u0131 a\u00e7\u0131yoruz.<\/p>\n

\"\"<\/a><\/p>\n

Program a\u00e7\u0131ld\u0131\u011f\u0131nda Server’a ba\u011flant\u0131y\u0131 soran ekran gelecek. Connect ile devam ediyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Evet art\u0131k dabase’imizi olu\u015fturmaya ba\u015flayabiliriz. Bunlar\u0131 yaparken elbette SQL’in derinliklerine dalmayaca\u011f\u0131z. Sadece i\u015fimizi g\u00f6recek kadar k\u0131sm\u0131n\u0131 kullanaca\u011f\u0131z.<\/p>\n

\"\"<\/a><\/p>\n

Ba\u015flayal\u0131m. Object Explorer’daki Databases klas\u00f6r\u00fcne sa\u011f klik yaparak a\u00e7\u0131lan menuden New Database’e t\u0131kl\u0131yoruz.<\/p>\n

\"\"<\/a><\/p>\n

Gelen New Database ekran\u0131nda sadece Database ismini verip OK ile \u00e7\u0131k\u0131yoruz. Elbette daha bir \u00e7ok ayar var ama default olarak gelen ayarlar bizim i\u015fimizi g\u00f6rmeye yetecek. Database’i isimlendirirken karakterler aras\u0131nda bo\u015fluk b\u0131rakmamaya dikkat edin.<\/p>\n

\"\"<\/a><\/p>\n

Object Explorer’daki Databases alt\u0131nda yeni database’imiz haz\u0131r.<\/p>\n

\"\"<\/a><\/p>\n

Database’imizin alt\u0131nda onunla ilgili \u00f6zelliklerde haz\u0131r. Biz bunlardan sadece Database Diagrams ve Tables’\u0131 kullanaca\u011f\u0131z.<\/p>\n

\"\"<\/a><\/p>\n

Tablolar\u0131m\u0131z neler olacak ve bu tablolar neler i\u00e7erecek? Bunu \u00e7\u00f6z\u00fcmleyelim.<\/p>\n

1- Kitap Listesi
\na- Kitab\u0131n ID
\nb- Kitab\u0131n ismi
\nc- Kitab\u0131n resmi
\nd- Kitab\u0131n yazar\u0131<\/p>\n

2- Kitap Detay
\na- Kitap ID
\nb- Kitap detay ID
\nc- Kitap Bask\u0131 Y\u0131l\u0131
\nd- Yay\u0131n evi
\ne- Sayfa say\u0131s\u0131
\nf- A\u00e7\u0131klama<\/p>\n

3- Yazar
\na- Yazar ID
\nb- Yazar ismi
\nc- Yazar\u0131n resmi
\nd- Yazar\u0131n A\u00e7\u0131klamas\u0131<\/p>\n

4-Mesajlar
\na- Mesaj ID
\nb- Mesaj Ba\u015fl\u0131\u011f\u0131
\nc- Mesaj\u0131n girildi\u011fi tarih
\nd- Mesaj alan\u0131<\/p>\n

Tablolar\u0131m\u0131z\u0131 belirledi\u011fimize g\u00f6re \u015fimdi bunlar\u0131 database’mizde olu\u015fturabiliriz. Database’in alt\u0131ndaki Tables’a sa\u011f klik yap\u0131p gelen men\u00fcden “New Table”a bas\u0131yoruz.<\/p>\n

\"\"<\/p>\n

\u0130lk tablomuzu a\u015fa\u011f\u0131daki gibi olu\u015fturuyoruz. Bu kitaplar\u0131n ismini tutacak tablo. Column Name’leri elle yazarken Data Type’lar\u0131 gelen men\u00fcden se\u00e7iyoruz. S\u0131ras\u0131yla olanlar\u0131 a\u00e7\u0131klayay\u0131m. “kitapID” ile her kitaba sadece ona ait olan bir numara verece\u011fiz. Bu sebeple data tipini (Data Type) int (tam say\u0131) olarak belirledik. Allow Nulls i\u015faretli de\u011fil \u00e7\u00fcnk\u00fc bu alan bo\u015f kalmas\u0131n istiyoruz. “kitapIsmi” i\u00e7in maksimum s\u0131n\u0131rs\u0131z karakterlik bir alan ay\u0131rd\u0131k. nvarchar kullanmam\u0131z\u0131n sebebi ise SQL o alana girilen kadar yer ay\u0131rs\u0131n istememizden kaynaklan\u0131yor. “kitapYazar” i\u00e7in nvarchar(50) kulland\u0131k. B\u00f6ylece bu alan\u0131n maksimum 50 karakterlik bir alan oldu\u011funu belirttik. “kitapImage” de ise Allow Nulls’u i\u015faretledik \u00e7\u00fcnk\u00fc kitap i\u00e7in resim olmayabilir.<\/p>\n

\"\"<\/a><\/p>\n

kitapID h\u00fccresi se\u00e7ili iken a\u00e7\u0131lan column properties’de Identity Specification’u “Yes”e \u00e7evirip Increment ve Seed’i “1” yap\u0131yoruz. Bu SQL’e ID numaralar\u0131n\u0131 sen ver ve birer birer arts\u0131n demek.<\/p>\n

\"\"<\/a><\/p>\n

kitapID’nin solundaki kutucu\u011fa sa\u011f klik yap\u0131p gelen men\u00fcden Set Primary Key’e bas\u0131yoruz.<\/p>\n

\"\"<\/a><\/p>\n

B\u00f6ylece kitapID’ye atanan her numaran\u0131n bir kez kullan\u0131labilir olmas\u0131n\u0131 sa\u011flad\u0131k.<\/p>\n

\"\"<\/a><\/p>\n

Tabloyu kaydetmek istedi\u011fimizde program bir isim belirlememizi istiyor. \u0130smimizi verip OK ile ilk tablomuzu tamaml\u0131yoruz.<\/p>\n

\"\"<\/a><\/p>\n

B\u00f6ylece ilk Table’\u0131m\u0131z\u0131 haz\u0131rlam\u0131\u015f olduk.<\/p>\n

\"\"<\/p>\n

\u015eimdi s\u0131rada kitap detay tablosu var. Biraz \u00f6nce haz\u0131rlad\u0131\u011f\u0131m\u0131z \u015fekilde yeni tablomuzu haz\u0131rl\u0131yoruz. Bu tabloda “kitapDetayID” primary key.<\/p>\n

\"\"<\/a><\/p>\n

\"\"<\/a><\/p>\n

\"\"<\/p>\n

\u015eimdi s\u0131rada yazarlar tablosu var. Yazar tablosunu da h\u0131zl\u0131ca olu\u015fturuyoruz.<\/p>\n

\"\"<\/a><\/p>\n

S\u0131rada mesaj tablosu var. Mesaj tablosunu da olu\u015fturduk. Bu tabloda da ID’yi otomatik verdirtmeyi unutmay\u0131n.<\/p>\n

\"\"<\/a><\/p>\n

B\u00f6ylece tablolar\u0131m\u0131z\u0131 tamamlam\u0131\u015f olduk.<\/p>\n

\"\"<\/p>\n

\u015eimdi tablolar aras\u0131ndaki ili\u015fkileri (relationship) d\u00fczenleyece\u011fiz. Burada birbiriyle ili\u015fkisi olan iki tablomuz dbo.kitap ve dbo.kitapDetay. kitapDetay, kitap tablosuna ba\u011fl\u0131 olarak \u00e7al\u0131\u015facak. \u015eimdi bu ili\u015fkiyi kural\u0131m. Database Diagrams’a sa\u011f t\u0131klay\u0131p a\u00e7\u0131lan men\u00fcde New Database Diagram’a baz\u0131yoruz.<\/p>\n

\"\"<\/a><\/p>\n

A\u00e7\u0131lan yeni sayfa ile birlikte Add Table ekran\u0131 geliyor. Buradan kitap ve kitapDetay’\u0131 se\u00e7ip Add’e bas\u0131yoruz ve Close ile ekran\u0131 kap\u0131yoruz.<\/p>\n

\"\"<\/a><\/p>\n

Ekran\u0131n ortas\u0131nda iki table kutu \u015feklinde g\u00f6r\u00fcn\u00fcr olmu\u015f olmal\u0131lar. Bu kutular\u0131 istedi\u011finiz yere s\u00fcr\u00fckleyebilirsiniz.
\n\"\"<\/a><\/p>\n

Mouse imlecini kitap kutusundaki kitapID’nin solundaki kutucu\u011fa t\u0131klay\u0131p s\u00fcr\u00fckleyerek, kitapDetay kutucu\u011funun, kitapID’sine g\u00f6t\u00fcr\u00fcyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Nerden nereye ve neyle neyi ili\u015fiklendirdi\u011fimizi g\u00f6steren bir ekran a\u00e7\u0131yor. Relationship do\u011fru ise OK ile kap\u0131yoruz.<\/p>\n

\"\"<\/a><\/p>\n

Arkadan gelen ekran\u0131 da bir de\u011fi\u015fiklik yapmadan OK ile kap\u0131yoruz.<\/p>\n

\"\"<\/a><\/p>\n

Diyagram\u0131 kaydediyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Databese Diagram\u0131m\u0131z haz\u0131r.<\/p>\n

\"\"<\/a>
\n\"\"<\/p>\n

Evet tablolar\u0131m\u0131z\u0131 olu\u015fturup ili\u015fkilerini de kurdu\u011fumuza g\u00f6re \u015fimdi i\u00e7lerini doldurabiliriz. \u0130lk etapta t\u00fcm tablolar\u0131 SQL’e man\u00fcel yazaca\u011f\u0131z. Dinamik olarak ekleme ve d\u00fczenleme i\u015flerini daha sonra g\u00f6rece\u011fiz. Tablomuzun i\u00e7ini doldurabilmek i\u00e7in ilk \u00f6nce a\u00e7mam\u0131z gerekiyor. Dolduraca\u011f\u0131m\u0131z tabloya sa\u011f klik yap\u0131p gelen men\u00fcden Open Table’a bas\u0131yoruz.<\/p>\n

\"\"
\nKitap tablosunu bo\u015f olarak a\u00e7\u0131l\u0131yor. \u015eimdi s\u0131ras\u0131yla bilgilerimizi dolduraca\u011f\u0131z. ID k\u0131sm\u0131n\u0131 biz de\u011fil SQL dolduracak.<\/p>\n

\"\"<\/a><\/p>\n

Kitap tablomuzu doldurduk \u015fimdi s\u0131rada kitap detay var.<\/p>\n

\"\"<\/a><\/p>\n

Ayn\u0131 \u015fekilde kitap detay tablomuzu da dolduruyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Ayn\u0131 \u015fekilde yazar tablomuzu da dolduruyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Mesaj tablomuzu da dolduruyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Database ile ilgili i\u015flerimizi tamamlad\u0131\u011f\u0131m\u0131za g\u00f6re SQL Management’i kapay\u0131p Expression Web’e d\u00f6nebiliriz. Sitemize devam edelim. Expression Web’de sitemizi a\u00e7\u0131p h\u0131zl\u0131ca master page’den bir sayfa olu\u015fturuyoruz. Bu sayfay\u0131 bookLists.aspx olarak kaydediyoruz.<\/p>\n

Bu sayfada kitaplar\u0131n tam listesini g\u00f6sterece\u011fiz. Toolbox>ASP.NET Controls>Data alt\u0131nda DataList’i sayfam\u0131zdaki main content alan\u0131na s\u00fcr\u00fckleyip b\u0131rak\u0131yoruz.<\/p>\n

\"\"<\/p>\n

DataList objesinin yan\u0131ndaki oka t\u0131klayarak Common DataList Tasks kutusunu a\u00e7\u0131yoruz. \u0130lk \u00f6nce database’imize ba\u011flanmam\u0131z gerekiyor. Bunun i\u00e7in Choose Data Source’dan “New data source”u t\u0131kl\u0131yoruz.<\/p>\n

\"\"<\/a><\/p>\n

Gelen ekranda Database’i se\u00e7ip OK’e bas\u0131yoruz. “Specify an ID for the data source” alan\u0131na otomatik belirlenen ismi de\u011fi\u015ftirmeyi gerekli g\u00f6rm\u00fcyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Gelen ekranda New Connection’a bas\u0131yoruz. B\u00f6ylece Choose Data Source kutusu a\u00e7\u0131lacak.<\/p>\n

\"\"<\/a><\/p>\n

Choose Data Source’da “Microsoft SQL Server”\u0131 se\u00e7ip OK’e bas\u0131yoruz.<\/p>\n

\"\"<\/a><\/p>\n

S\u0131radaki ekran Connection Properties. Burada Server Name’i yaz\u0131yoruz. \"\" E\u011fer server name’niz SQL Server Management Studio Express’deki Object Explorer’daki isme bakabilirsiniz. “Use Windows Authentication” se\u00e7ili kal\u0131yor. “Select or enter a database name” den database’imizi bulup se\u00e7iyoruz. Bu ekranda Test Connection’a basarak ba\u011flant\u0131n\u0131z\u0131 kontrol edebilirsiniz. Sorun yoksa OK ile devam ediyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Next ile devam ediyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Next ile devam ediyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Gelen ekranda “kitap” tablosunu se\u00e7iyoruz. Tablonun t\u00fcm elemanlar\u0131n\u0131 se\u00e7mek i\u00e7in “*” \u0131 se\u00e7iyoruz. Asl\u0131nda “kitapID”ye ihtiyac\u0131m\u0131z olmayacak ama \u00f6nemli de\u011fil d\u00fczenlemeleri daha sonrada yapabiliriz. Her \u015fey yolunda ise Nexyt ile devam ediyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Buraya kadar yapt\u0131klar\u0131m\u0131z\u0131 kontrol etmek i\u00e7in gelen ekranda “Test Query”ye bas\u0131yoruz. Her \u015fey yolunda ise Finish ile bitiriyoruz.<\/p>\n

\"\"<\/a><\/p>\n

T\u00fcm bu i\u015flemlerle database ba\u011flant\u0131m\u0131z\u0131 kurup, bilgileri \u00e7ekmi\u015f olduk. Bunun sonucunda EW alttaki gibi kod \u00fcretti.<\/p>\n

<asp:DataList runat=”server” id=”DataList1″ DataKeyField=”kitapID” DataSourceID=”SqlDataSource1″>
\n<ItemTemplate>
\nkitapID:
\n<asp:Label Text='<%# Eval(“kitapID”) %>’ runat=”server” id=”kitapIDLabel” \/>
\n<br \/>
\nkitapIsmi:
\n<asp:Label Text='<%# Eval(“kitapIsmi”) %>’ runat=”server” id=”kitapIsmiLabel” \/>
\n<br \/>
\nkitapYazar:
\n<asp:Label Text='<%# Eval(“kitapYazar”) %>’ runat=”server” id=”kitapYazarLabel” \/>
\n<br \/>
\nkitapImage:
\n<asp:Label Text='<%# Eval(“kitapImage”) %>’ runat=”server” id=”kitapImageLabel” \/>
\n<br \/>
\n<br \/>
\n<\/ItemTemplate>
\n<\/asp:DataList>
\n<asp:SqlDataSource runat=”server” ID=”SqlDataSource1″ ConnectionString=”<%$ ConnectionStrings:FrpKitapSitesiConnectionString %>” SelectCommand=”SELECT * FROM [kitap]”>
\n<\/asp:SqlDataSource><\/div>\n

\u015eu andaki g\u00f6r\u00fcn\u00fcm ise \u015f\u00f6yle;<\/p>\n

\"\"<\/a><\/p>\n

S\u0131rada database’den gelen bu bilgileri d\u00fczenleme i\u015fleri var.\u00a0 DataList’i se\u00e7ip yan\u0131ndaki oka t\u0131klayarak Common DataList Tasks kutusunu a\u00e7\u0131yoruz ve Edit Templates’e t\u0131kl\u0131yoruz.<\/p>\n

\"\"<\/a><\/p>\n

Display’de ItemTemplate se\u00e7ili olacak. Bu ekranda olduk\u00e7a rahat\u0131z. ItemTemplate kutucu\u011funun i\u00e7ine t\u0131klayarak istedi\u011fimiz Item’i silebilir, ekleme yapabiliriz.<\/p>\n

\"\"<\/a><\/p>\n

kitapID’yi ve kitapImage’i oldu\u011fu gibi siliyoruz. \u0130maj biraz sonra \u00e7\u00f6zece\u011fiz. kitapIsmi’ni siliyoruz. kitapYazar’\u0131 Yazar olarak de\u011fi\u015ftiriyoruz.<\/p>\n

\"\"<\/p>\n

\u0130maj konusunu halledelim [kitapIsmiLabel]’in \u00fcst\u00fcndeki bo\u015f alana Toolbox>ASP.NET Controls>Standard alt\u0131ndaki Image’i s\u00fcr\u00fckleyip b\u0131rak\u0131yoruz.<\/p>\n

\"\"<\/p>\n

Image ikonunun yan\u0131ndaki oka t\u0131klayarak a\u00e7\u0131lan men\u00fcden Edit DataBindings’e t\u0131kl\u0131yoruz. Blindable Properties’de ImageUrl’i se\u00e7iyoruz. Burada Field bindingi i\u015faretli olacak \u015fekilde b\u0131rak\u0131yoruz. Bound to’da database’deki imaj kolonumuzu se\u00e7iyoruz. Format’a imajlar\u0131m\u0131z\u0131n durdu\u011fu yolu yaz\u0131yoruz. \u00d6rnek: images\/books\/thumb sonuna {0} ekliyoruz. (images\/books\/thumb\/{0}). OK’e bas\u0131yoruz.<\/p>\n

\"\"<\/a><\/p>\n

Sonu\u00e7. \u0130majlar\u0131m\u0131z\u0131 da ba\u015far\u0131yla database’den ald\u0131k.<\/p>\n

\"\"<\/a><\/p>\n

Elbette bir format sorunu var yaz\u0131lar\u0131n imajlar\u0131n alt\u0131nda de\u011fil yan\u0131nda olmas\u0131n\u0131 istiyoruz. Bunu da yapmak \u00e7ok kolay. DataList’in yan\u0131nda ki oka t\u0131klayarak Edit Templates’i tekrar a\u00e7\u0131yoruz ve imaj ikonu se\u00e7iliyken Apply Styles’dan .imageLeft kural\u0131n\u0131 uyguluyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Evet istedi\u011fimiz formata geldiler ama hala sorunlar var. Itemlar\u0131n aras\u0131n\u0131n daha a\u00e7\u0131k olmas\u0131n\u0131 ve kitap ile ilgili yaz\u0131lar\u0131n kitapla ayn\u0131 \u00fcst hizada olmas\u0131n\u0131 istiyoruz. Split g\u00f6r\u00fcn\u00fcmde iken kodlara bak\u0131yoruz ve imaj tag\u0131n\u0131n sonuna eklenmi\u015f <br\/> yi siliyoruz. (K\u0131rm\u0131z\u0131 sat\u0131r.) Bu yaz\u0131lar\u0131n kitapla ayn\u0131 \u00fcst hizadan ba\u015flamas\u0131n\u0131 sa\u011fl\u0131yor.<\/p>\n

<asp:DataList runat=”server” id=”DataList1″ DataKeyField=”kitapID” DataSourceID=”SqlDataSource1″>
\n<ItemTemplate>
\n<asp:Image runat=”server” id=”Image1″ ImageUrl='<%# Eval(“kitapImage”, “images\/books\/thumb\/{0}”) %>’ CssClass=”imageLeft” \/>
\n<br \/>
\n<asp:Label Text='<%# Eval(“kitapIsmi”) %>’ runat=”server” id=”kitapIsmiLabel” \/>
\n<br \/>
\nYazar :
\n<asp:Label Text='<%# Eval(“kitapYazar”) %>’ runat=”server” id=”kitapYazarLabel” \/>
\n<br \/>
\n<br \/>
\n<\/ItemTemplate><\/asp:DataList><\/p>\n<\/div>\n

DataList se\u00e7iliyken Tag Properties’de CellPadding’i 10 yap\u0131yoruz. Bu itemlar\u0131n aras\u0131n\u0131n a\u00e7\u0131lmas\u0131n\u0131 sa\u011flayacak.<\/p>\n

\"\"<\/p>\n

Hala bir sorunumuz var. Sayfay\u0131 taray\u0131c\u0131larda kontrol etti\u011fimizde FireFox’da her \u015fey d\u00fczg\u00fcn \u00e7al\u0131\u015f\u0131rken, Internet Explorer’da listenin ilk item\u0131nda kitap ismi ile yazar aras\u0131nda bo\u015fluk olu\u015fuyor.<\/p>\n

\"\"<\/a><\/p>\n

Split g\u00f6r\u00fcn\u00fcm\u00fcne ge\u00e7iyoruz ve ItemTemplate i\u00e7indeki taglar\u0131 DIV i\u00e7ine al\u0131yoruz. B\u00f6ylece her iki taray\u0131c\u0131da da sayfam\u0131z sorunsuz \u00e7al\u0131\u015f\u0131yor.<\/p>\n

\n

<ItemTemplate><\/p>\n

<div><asp:Image runat=”server” id=”Image1″ ImageUrl='<%# Eval(“kitapImage”, “images\/books\/thumb\/{0}”) %>’ CssClass=”imageLeft” \/><\/div><\/p>\n

<div><asp:Label Text='<%# Eval(“kitapIsmi”) %>’ runat=”server” id=”kitapIsmiLabel”\/><\/div><\/p>\n

<div>Yazar : <asp:Label Text='<%# Eval(“kitapYazar”) %>’ runat=”server” id=”kitapYazarLabel” \/><\/div><\/p>\n

<br \/>
\n<br \/><\/p>\n

<\/ItemTemplate><\/p>\n<\/div>\n

\u015eimdilik bu sayfayla i\u015fimiz bitti daha sonra buraya d\u00f6necek ve kitaplar\u0131n detaylar\u0131na i\u00e7in link verece\u011fiz. \u015eimdi mesaj sayfas\u0131n\u0131 olu\u015ftural\u0131m. Master page’den yeni bir sayfa olu\u015fturuyoruz.Bu sayfay\u0131 da messages.aspx olarak kaydediyoruz. Main contentin i\u00e7ine tekrar DataList yerle\u015ftiriyoruz ve kitap listesi sayfas\u0131nda oldu\u011fu gibi database ba\u011flant\u0131s\u0131n\u0131 ayarl\u0131yoruz. Tek farkla o da bu ba\u011flant\u0131da kitap tablosunu de\u011fil mesaj tablosunu \u00e7ekiyoruz.<\/p>\n

\"\"<\/a><\/p>\n

Edit Templates’de mesajID’yi tamamen kald\u0131r\u0131yoruz. mesajBasligini siliyoruz, label’\u0131 kal\u0131yor. mesajTarih’i Mesaj Tarihi olarak de\u011fi\u015ftiriyoruz. mesajAlani yaz\u0131s\u0131n\u0131 siliyoruz label’i kal\u0131yor.<\/p>\n

\"\"<\/a><\/p>\n

Kontrol etti\u011fimizde bilgileri ba\u015far\u0131yla \u00e7ekti\u011fimizi g\u00f6r\u00fcyoruz ama her \u015fey i\u00e7 i\u00e7e ge\u00e7mi\u015f durumda biraz d\u00fczenleme yapmam\u0131z gerekecek.<\/p>\n

\"\"<\/a><\/p>\n

Edit template’de mesajAlaniLabel’in alt\u0131na HTML>Tags alt\u0131ndan Horizontal Line’\u0131 s\u00fcr\u00fckleyip b\u0131rak\u0131yoruz. Line’\u0131n alt\u0131na da Enter’a basarak iki bo\u015fluk (<br\/>) ekliyoruz.<\/p>\n

\"\"<\/p>\n

B\u00f6ylece mesajlar\u0131 birbirinden ay\u0131rm\u0131\u015f olduk. \u015eimdi mesaj ba\u015fl\u0131klar\u0131n\u0131 biraz farkl\u0131la\u015ft\u0131ral\u0131m.<\/p>\n

\"\"<\/a><\/p>\n

Bunun i\u00e7in Manage Style kutusunda New Style’a t\u0131kl\u0131yoruz ve “.boldText” ismindeki kural\u0131m\u0131z\u0131 olu\u015fturuyoruz..<\/p>\n

\"\"<\/a><\/p>\n

.boldText Current Page’in i\u00e7inde olu\u015fuyor. Bunun format.css’in i\u00e7ine s\u00fcr\u00fckleyip b\u0131rak\u0131yoruz.<\/p>\n

\"\"<\/p>\n

DataList’in Edit Template’inde mesajBasligiLabel’ina .boldText’i Apply Style ile uyguluyoruz. Bunu da d\u00fczeltti\u011fimize g\u00f6re,\u00a0 tarih sat\u0131r\u0131yla mesaj sat\u0131r\u0131n\u0131 birbirinden ay\u0131rmal\u0131y\u0131z. Bu da sadece Edit Template’de mesajTarihLabel in sa\u011f\u0131na imlecinizi getirip iki kere Enter’a basmaktan ibaret.<\/p>\n

Sonu\u00e7.<\/p>\n

\"\"<\/a><\/p>\n

Bu makalede SQL Server Express Edition kurulumunu, SQL Express’de database olu\u015fturmay\u0131 ve SQL database’den veri \u00e7ekmeyi anlatt\u0131m. Serinin devam\u0131 niteli\u011findeki makalemizde listelenmi\u015f kitaplar\u0131n detaylar\u0131na dinamik olarak link vermeyi inceleyece\u011fiz.
\n\u0130yi \u00e7al\u0131\u015fmalar<\/p>\n

Te\u015fekk\u00fcrler<\/p>\n","protected":false},"excerpt":{"rendered":"

9\/5\/2007 Merhaba bu makalemde, ilk makalede tasar\u0131m\u0131n\u0131 oturttu\u011fumuz Frp Kitap Merkezi sitesini dinamik hale getirmek i\u00e7in ilk ad\u0131mlar\u0131m\u0131z\u0131 ataca\u011f\u0131z. Bu a\u015famada database olarak Microsoft SQL Server 2005 Express Edition’u kullanaca\u011f\u0131z. SQL Server ile ilgili yard\u0131mlar\u0131 i\u00e7in ekip arkada\u015f\u0131m Behl\u00fcl Behram’a \u00e7ok te\u015fekk\u00fcrler. E\u011fer y\u0131llard\u0131r yapt\u0131\u011f\u0131n\u0131z tasar\u0131mlar\u0131 statik olarak haz\u0131rlamaktan s\u0131k\u0131l\u0131p s\u0131k\u0131l\u0131p s\u00fcrekli bir o dile […]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11],"tags":[29],"class_list":["post-395","post","type-post","status-publish","format-standard","hentry","category-teknik-yazi","tag-expression-web"],"_links":{"self":[{"href":"http:\/\/erbugkaya.com\/index.php?rest_route=\/wp\/v2\/posts\/395","targetHints":{"allow":["GET"]}}],"collection":[{"href":"http:\/\/erbugkaya.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/erbugkaya.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/erbugkaya.com\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"http:\/\/erbugkaya.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=395"}],"version-history":[{"count":4,"href":"http:\/\/erbugkaya.com\/index.php?rest_route=\/wp\/v2\/posts\/395\/revisions"}],"predecessor-version":[{"id":397,"href":"http:\/\/erbugkaya.com\/index.php?rest_route=\/wp\/v2\/posts\/395\/revisions\/397"}],"wp:attachment":[{"href":"http:\/\/erbugkaya.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=395"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/erbugkaya.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=395"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/erbugkaya.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=395"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}