PHP JQuery ile Dinamik Yorum Ekleme ve Yanıt Sistemi

Merhaba bu konu sizlere dinamik yapıda anlık yorumlama sisteminden ve yapılışından bahsedeceğim.

Bu yöntem ile kullanıcılarınız makalelerinize veya blog yazılarınıza yorum yapabilmesini sağlayabilir ve dinamik yapısı sayesinde Facebook gibi anlık yorum ekleme ve yanıtlama işlemelerini ziyaretçilerinize sunabilirsiniz. Alt yapı bakımından veritabanına ihtiyaç duyan PHP yorum sistemimiz, Javascript JQuery sayesinde erişebilirliği ve kullanımı gayet kolay olacaktır.

Ayrıca daha önce yapılmış yorumlara kullanıcıların yanıt verebilmesi için tam otomatik bir sistem olacaktır.

Bu sistemi söylediğim gibi makale, blog ve farklı alanlarda kullanabilirsiniz. Veritabanı gereksinimi duyduğumuz için öncelikle veritabanı yapısından başlayalım. Veritabanı yapısı içeriklerin ve yorumların tutulduğu iki tablo bulunmaktadır. Yorumlar makale ya da içeriklerle bağlantısı id değeri ile olacaktır.

Sistemimiz 5 başlık altında sıralayabiliriz.

1. Veritabanı yapısı.

2. İçerik detay

3. Yorum formu,

4. Yorum işleme

5. Yorumları listeleme

Başlayalım.

 

1. Veritabanı yapısı;

Veritabanın da bulunan yorumlar tablosunda yorumlara yanıtlama veya cevaplama yetkisi verebilmek için alt_yorum sütununu ekliyoruz. Böylelikle yanıt verilecek yorumun id değeri bu sütunda belirtilecek.

2. İçeriklerin detay, icerik.php;

 

Not: Yazıları normal bir şekilde listeliyoruz ve detay sayfasına get yöntemiyle geçiyoruz. Ufak bir .htaccess kodu ile self url kullanıyoruz.

3. Yorum formu;

Yorum formumuz da iki önemli kısım bulunmakta bunlardan ilki hangi içeriğin yorumunu yapacağımız. İkincisi ise yapılacak yorumum yanıt olup olmadığı. Bircisini icerik_id değerini belirtmek, ikincisi comment adında bir get varlığını sorgulayıp varsa id değerini belirtmek. Geri kalan kısımda adı soyadı, mail ve yorum alanları ve bunu gönderecek bir butonumuz bulunmaktadır.

4. Yorum işleme jquery ve yorum.php;

Jquery;

Form alanımızda eklenen yorumun veritabanına doğru bir şekilde gönderebilmek ve dinamik bir yapı oluşturmak amacıyla Jquery yapısını kullanıyoruz. Form kısmında submit edildiği anda serialize yöntemiyle formdaki bütün verileri çekiyoruz.

Type post Datatype ise json olarak belirtiyoruz. Datatype json belirlemekteki amaç geri dönüşte birden farklı işlemde kullanabilmek için verimizi dizin olarak geri istiyoruz.

Gönderme işleminin başarılı olması halinde gelen veride eğer bir alt_yorum değeri varsa içerik sayfasında ilgili yorumun altına eklenebilmesi için bir koşul belirtiyoruz. Yani alt_yorum değeri 5 ise sayfada id değeri 5 olan yorumun altına son eklenen yorumu ekliyoruz. Ya da 0 ise direk yorumu formun altına post ediyoruz.

Son olarak işlem başarılı ise formun içindeki bazı değerleri boşaltıyoruz.

yorum.php;

Formdan gelen verileri bu sayfada veritabanına kaydetme işlemi yapıyoruz.

Insert yöntemi ile tüm form verilerini tabloda bulunan alanlara ekliyoruz. Ek bir tedbirle boş form girdileri olması halinde ekleme işlemi pas geçiyoruz.

Insert işlemi başarılı olması halinde lastInsertId() yöntemiyle eklediğimiz verinin id değerini öğrenerek bir sorgu yapıyoruz ve gelen veriyi html array dizinine ekliyoruz.

Ve son olarak html içerisine verilerimiz ekleyip $getir adındaki json datamıza ekliyoruz.

Elde ettiğimiz verileri json_encode($getir)  ile çıktı yapıyoruz. Bundan sonraki işlem ajax tarafında yakalanıp yorumlar kısmına eklenmesidir.

5. Veri tabanından Yorumları ve Yanıtları Listeleme;

Yorumlarımız icerik_id değeri ile geldiğini söylemiştik, yorumlarımız HTML tagları olan ve listeleme işleminde kullanılan ul li yapısıyla göstereceğiz.

Burada dikkat etmemiz gerek kısım yorumların tamamını kendi oluşturduğumuz array içerisine ekliyoruz. Yani sadece bir sorguyla birçok yorumu öğrenip gerektiği yerlerde tekrar sorgu yapmadan kullanacağız.

Önceliğimiz yorum adında bir fonksiyon oluşturmak, bu fonksiyon sayesinde birden fazla kez kullanabileceğiz. Fonksiyon parametreleri 3 tane olacak şekilde başlayalım,

1. parametre id; İçerik id numarası için,

2. parametre array; daha sonra ilgili yorumun sorguda sonraki alt yorum listesi,

3. parametre alt; bütün alt yorumların toplu listesi.

Burada id değeri boş ise şu şekilde devam eder Bknz(koşul başı 1);

Parametreleri belirttikten sonra örnek bir dizin oluşturalım ve içerisine all ve alt adında iki dizin daha oluşturalım.  Ne işe yaradıkları epey belli oluyor, birisi ana yorumları diğeri yanıtları tutacak.

Sorgumuzu yaptıktan sonra while içinde oluşturduğumuz dizinlere verilerimizi koşullu olarak ekliyoruz.

Sorgulama bittikten sonra iki dizini yeni bir değişkene aktarıp ilk koşul için hazırlıyoruz. Bknz.(koşul sonu 2)

Koşulumuzda parametrede ki id değeri boşsa array değerinin olduğunu varsayarak for değişkenine array dizinini ekliyoruz ve foreach ile devam ediyoruz. Yoksa ilk eklenen diziniz işleme alıyoruz ve foreach ile değerlerimizi listeliyoruz.

Listeleme esnasında içerik id numarasıyla devam ettiğimizi varsayarsak olası bir alt yorum olması halinde ikinci koşulumuz olan alt yorum metodunu devreye sokuyoruz. Bknz(koşul başı 2).

Koşul içinde sorgumuzu alt yorumların kaydedildiği dizinde benzer bir id değeri varsa işlem girer.

Ul li taglarına yorum fonksiyonunu tekrar çalıştırır, ilk parametre boş, ikinci parametre listeleme esnasındaki yorum id değerine eş yorumları listesini gönderir, üçüncü parametre ise bütün alt yorumların listesini gönderir.

Bu işlemden sonra sorgu tekrar başlar ve ilgili yorumun alt yorumlarını yani yanıtlarını listelemek için 2. Parametreyi kullanır. Burada ilk koşulu karşılamadığı için for değişkenine 2. Parametreyi ekler ve foreach döngüsüne girer.

 

Github linki: https://github.com/hakkbulutsereme/dynamic-commet

Sorularınız için yorum yapabilir, beğenerek ve puan vererek konuyu değerlendirebilirsiniz.