Mart 31

Prototype.js Kılavuzu - 4

AJAX & Hazır Kütüphaneler orhan

Sayfaya HTML kodu girmek (Insertion)

Prototype ile çalışırken sayfanın HTML kodlarına müdahale eden işlemlere ihtiyacınız olabilir. Bu tür ihtiyaçları geleneksel kodlama teknikleri ile yapmak oldukça zahmetli ve fazlaca vakit alan işlemlerdir. Bu konuda çoklu tarayıcı desteği ve pratik uygulama şekli ile girdi yöntemleri (insertion) işlerimizi müthiş bir biçimde kolaylaştırmakta.

.After

Belirtilen elementten sonra HTML kodu ekler.

Orijinal HTML


<div>
<p id="animal_vegetable_mineral">In short, in all things vegetable, animal, and mineral...</p>
</div>

PLAIN TEXT
JAVASCRIPT:
  1. new Insertion.After(
  2. 'animal_vegetable_mineral',
  3. "<p>I am the very model of a modern major general.</p>"
  4. );

Sonuç olarak üretilen HTML


<div>
<p id="animal_vegetable_mineral">In short, in all things vegetable, animal, and mineral...</p>
<p>I am the very model of a modern major general.</p>
</div>

.Before

Belirtilen elementten önce HTML kodu ekler.

.Bottom

Belirtilen objenin içine verilen HTML kodunu son alt element olarak (içeriğin sonuna) ekler.

.Top

Belirtilen objenin içine verilen HTML kodunu ilk alt element olarak (içeriğin başına) ekler.

Orijinal HTML


<div id="modern_major_general">
<p>I am the very model of a modern major general.</p>
</div>

PLAIN TEXT
JAVASCRIPT:
  1. new Insertion.Top(
  2. 'modern_major_general',
  3. "<p>In short, in all things vegetable, animal, and mineral...</p>"
  4. );

Sonuç olarak üretilen HTML


<div id="modern_major_general">
<p>In short, in all things vegetable, animal, and mineral...</p>
<p>I am the very model of a modern major general.</p>
</div>

Sayfalar: 1 2

Toplamda 6095 kez okunmuş.
Şu an 2 kişi okuyor.
En fazla 5 kişi aynı anda okumuş.
Bugün 1 kez okunmuş.

Etiketler: , , , , 

1 oy2 oy3 oy4 oy5 oy (17 oy, ortalama 4.53) Oylanıyor ... Oylanıyor ...

  1. PHP ve Yerleşik DOM Sınıfları
  2. Javascript Sanal Klavye Yapalım
  3. Ajax Olmasaydı Ne Yapardık ? :)

Trackback Yorumları takip et Baskı Önizleme

19 yorum var

  1. # kiirpi | 01 Nisan 2007, 22:24 Gravatar

    daha ne olsundu son yorum ama erken bir yorum olmuşş :) tebrikler..

  2. # ayşe | 03 Nisan 2007, 22:12 Gravatar

    Örnekleri denedim. Güzel çalıştı. Teşekkürler…

  3. # orhan | 06 Nisan 2007, 22:25 Gravatar

    @kiirpi yazılacak şeyler daha bitmedi devamını bekleyiniz :)

  4. # deniz | 10 Nisan 2007, 20:45 Gravatar

    eline sağlı ama kodların kullanımını yazmamışsınız mesela bir AJAX.Request nesnesini bir buttonda uygularken nasıl yapacaz bunlarıda yazarsanız biz acemilere çok yardımcı olursunuz

    saygılarımla
    çok teşkkürler

  5. # yakuter | 11 Nisan 2007, 18:44 Gravatar

    @deniz, haklısın dediğinde. Sanırım önce bu temel bilgi ile ilgili bir makale yazmalıydık. Ama hiç bir şey için geç sayılmaz değil mi ;)

    En kısa zamanda bu javascript fonksiyonlarının nasıl çağırılacağı konusunda bir makale yazacağız.

    Teşekkür ederiz bu önemli konuyu bize hatırlattığın için ;)

  6. # Özcan BERBER | 13 Nisan 2007, 15:31 Gravatar

    Merhabalar güzel bir çalışma çoğunu sayenizde uyguladım ama bir problrm çıkıyor. ajaxta çağıtdığım dosyanın içinde script varsa dosya çalıçmıyor bunun nasıl hallederim.

  7. # Özcan BERBER | 13 Nisan 2007, 15:40 Gravatar

    merhabalar ajaxta çağırı yaparken türkçe kod desteğini nasıl uyguluyoruz encoding:’latin5′

    new Ajax.Updater(’ortasayfa’, ‘telefon_rehberi.php’,{asynchronous:true, evalScripts:true, encoding:’latin5′ }); return false;

    bu kodda olmuyor yine bu kodla eğer çağırdığım sayfanın içinde js kodu varsa onlarda çalışmıyor.

  8. # bgoral | 16 Nisan 2007, 09:38 Gravatar

    Merhaba,
    1. Ajaxta çağru yaparken türkçe dil desteğine itiyacınız yok. Sunucu tarafında hangi encodingde gönderiyorsanız ve sayfanızın meta tagında charset ne ise buna göre aldığınız veri gösterilir. Birde not ben utf-8 kullanmanızı öneririm.
    2. evalScripts eğer server tarafından tagları arasında bir kod gönderiyorsanız bunun çalıştırılması için kullanılır. Yanlış bir kullanım olmuş olabilir. Veya kod örneğine göre değerlendirme yapılabilir.
    3. prototype ile herhangi bir fonksiyonu çağırırken, ör Ajax.Request, var ile yeni bir değişken tanımlamanıza gerek yoktur.

    ör :
    new Ajax.Request(url,{method:”get”,function(r){
    //mesela
    eval(”var obj = ” + r.responseText);
    //eğer headerlar x-json ise
    var obj = this.evalJSON();

    }});

    işte bukadar kolay :) .

  9. # Özcan BERBER | 16 Nisan 2007, 17:06 Gravatar

    bgoral kardeş çok güzel anlartında
    Ajax.Updater(’ortasayfa’, ‘telefon_rehberi.php’
    işleminde ben bunu dir containner e yüklüyorum bununiçine nasıl yazacağım onu birde mümkünse bir ornek olsa çok makbule geçer

  10. # Özcan BERBER | 28 Nisan 2007, 16:28 Gravatar

    Arkadaşlar Allah Aşkına Şu ajaxla çağırdığımız dosyanın içindeki scripleri nasıl çalıştığını bi rde
    ajax.updater için anlatın. Bu kısımda takıldım kaldım. Hatta bir örnek yapın her yerde kod var ama nasıl çalıştırılacak bunlar onu cevabı yok. En iyisi bir örnek. Her yerde bu problem mevcut.
    İlginize şimdiden teşekkürler

  11. # eburhan | 28 Nisan 2007, 16:44 Gravatar

    Ajax.Updater içerisinde evalScripts:true parametresini kullanman yeterli olacaktır. Alttaki kodda olduğu gibi ;)


    function Ajaxla() {
    new Ajax.Updater(’sonuc’, ‘cevap.php’, {evalScripts:true});
    }

  12. # Özcan BERBER | 17 Mayıs 2007, 10:57 Gravatar

    kardeş sağolasın yazdıklarının hepsi işime yaradı problemleri çözdüm yanlız yükleniyor olayı için prototype te özel bir işlem varmı nasıl yazmamız gerekiyor.

  13. # Ahmet | 21 Mayıs 2007, 21:46 Gravatar

    insertion komutları ff de çalıştı ama ie’ de çalışmıyor ne yapmalıyım

  14. # Ahmet | 21 Mayıs 2007, 22:38 Gravatar

    ajax la php dosyasından veri çeken basit çalışan bir örnek yazabilirmisiniz lütf

  15. # orhan | 22 Mayıs 2007, 10:06 Gravatar

    muhtemelen IE deki bir bug (hata) dan kaynaklanıyordur. Şu aşamada ne yapabilirsin bilemiyorum ama klasik yöntemlerle kaynak kodu güncelleme yoluna gidebilirsin. Yani prototype yokmuş gibi kod yazarak ie ye özel bir durum tanımlayabilirsin.

  16. # n’oldu?be » Haber » Evet mi Hayır mı? | 20 Temmuz 2007, 15:21 Gravatar

    […] AJAX ile aldığımız veriyi sayfanın neresinde göstermek istiyorsak ID yazan yere konumunu belirtiyoruz. dosya yazan yere ise AJAX ile iletişim kurduğumuz sayfanın tam ismini yazıyoruz. Ve son olarak köşeli parantezler içerisine de Ajax.Updater nesnesinin alabileceği ek parametreleri bildiriyoruz. Örneğin verilerin POST yöntemiyle mi yoksa GET yöntemiyle mi gönderileceğini, eğer veriler POST yöntemiyle gönderilecekse bu verilerin ne olduğunu “parametreler” bölümüne belirtiyoruz. Ajax.Updater ile ilgili daha fazla bilgiyi bu sayfada bulabilirsiniz. […]

  17. # Çağlar | 13 Kasım 2007, 16:04 Gravatar

    Prototype’ın ajax fonksiyonlarıyla dosya upload işlemi yaptırmak istiyorum. Normal html formu ile çalışan php kodum var. Fakat HTML formu yerine Ajax.Updater nesnesi kullandığımda php kodu $_FILES[’dosya’] degerini boş bırakıyor. Yani dosya gönderilmiyor. Internette de bununla ilgili bir yazı bulamadım. Yardımcı olursanız sevinirim.

  18. # ayhan | 17 Aralık 2007, 13:43 Gravatar

    updater ve PeriodicalUpdater kullanıyorum ve çağırdıgım sayfadaki türkçe karakterlerde bozulma oluyor. encoding: ‘utf-8′ yapıyorum , encoding: ‘ISO 8859-2′ yide denedim hala sorun var. yardımcı olursanız sevınırım.

  19. # ayhan | 17 Aralık 2007, 14:26 Gravatar

    hallettim teşekkürler yine de kaynak olsun diye yazayım.

    $char = array(”ı”, “ÄŸ”, “ü”,”ÅŸ”,”ç”,”ö”,”a”,”Ãœ”,”Ğ”,”Ş”,”Ç”,”Ö”);
    $text = array(”ı”, “ğ”, “ü”,”ş”,”ç”,”ö”,”İ”,”Ü”,”Ğ”,”Ş”,”Ç”,”Ö”);
    $b = str_replace($text, $char, $_GET[a]);

Yorum yazın

sayfa sayacı