Bir Öğrenci Klasiği – AUG

Php ve Jeditable ile Yerinde Düzenleme

Merhaba arkadaşlar. Bugün sizlere bir jQuery eklentisi olan Jeditable yi tanıtıp / uygulama yapımını göstereceğim. Jeditable hakkında çok az ders mevcut. Bu derslerde malesef Türkçe değil. Beni de biraz zorladığı için sizlere anlatımını hemen yapayım.

Şimdi arkadaşlar. Jeditable nedir diyenleriniz olabilir. Demo olarak buraya bakabilirsiniz. Eğer nasıl birşey olduğunu anladıysanız ve sevdiyseniz dersimize girelim.

Öncelikle bu javascriptlerini dosyalarını bilgisayarımıza kaydedelim. Bu birinci bu da ikinci dosya. Siz bunların içindeki kodları alıp txt dosyasına yapıştırın ve adlarını jquery.js ile jquery_002.js yapın.

Şimdi bu dosyaları index.php demizin içine çağırmamız lazım. < /head> etiketinden hemen önce;

< script src="jquery.js" type="text/javascript" charset="utf-8">< /script>
< script src="jquery_002.js" type="text/javascript" charset="utf-8">< /script>

kodlarını ekleyelim. Ardından p etiketi ile belirleyeceğimiz class ı tanımlayalım;

< script type="text/javascript" charset="utf-8">
$(function() {
$(".editable_textarea").editable("islem.php", {
indicator : "İşleminiz Yapılıyor...",
type   : 'textarea',
onblur : 'submit',
select : true,
submit : 'OK',
cancel : 'cancel',
});
});
< /script>

tabi bu kodu üstteki js kodlarının hemen altına koyuyoruz. Şimdi db mizde kayıtlı olan yazıları çekicez. Yazıların üstüne tıklayınca aynı demoda ki gibi metin alanı çıkıcak ve islem.php ye yollacak. O da mysql den yazımızı güncelleyecek. Tabi bunların hepsi aynı sayfada yenilenmeden yapılacak…

Öncelikle yazılarımızı çekelim;

<?
include baglan.php
$sor = mysql_query("SELECT * FROM yazilar") or die ("Problem var");
$yaz=mysql_fetch_array($sor);
$id = $yaz['id'];
$baslik = $yaz['baslik'];
?>

İşte gördüğünüz gibi bu kodumuzla yazılarımızı çektik. Şimdi bunları ekrana basacağız fakat p etiketimiz ile.  Bu sayede yazılarımız tek tıklamayla yerinde düzenlenebilecek;

<p class="editable_textarea" id="<? echo "$id"; ?>"><? echo "$metin"; ?></p>

Buraya kadar herşey tamamlandı. Gerisinde ise islem.php mizi düzeltmemiz lazım. islem.php de bu şekilde olacak;

<?
include baglan.php
$id = $_POST["id"];
$metin = $_POST["value"];
$gyazi=mysql_query("UPDATE yazilar SET `metin`='$metin' WHERE `id`='$id' ") or die ("Bir problem olustu") ;
echo "Yazı değiştirildi";
?>

İşte gördüğünüz gibi çok kolay bir şekilde jQuery ve Php ile işlem yaptık. Diğer makalelerimde görüşmek üzere, hoşçakalın…

İyi günler, iyi çalışmalar…

Benzer Yazılar;

• Javascript ile Yazı Üzerine Gelince Açılan Baloncuklar :)
• Php de jQuery Yardımıyla Veri Post Etme
• Ajax ve Php Kuramı
• Tek bir Ajax Fonksiyonu ile Bütün Veri İşlemleri
• Ajax Accordion Menu ile Php Birleşimi