| Henüz Üye Degilmisin ? Üye Ol | Parolamı Unuttum |
![]() |
| | #1 |
![]() | Açıkçası sizlerle paylaşacağım kodlar bana ait değil. AJAX 'a ilk başladığımda pek Javascript bilgim yoktu. Bu nedenle hazır olan bir ajax araç kiti aradım. Buldum da... "Simple AJAX Code-Kit (SACK) v1.6.1" adındaki ilk kiti buldum. Fakat Beklentilerimi karşılamadı. Kendi Localhost'umda sorun çıkarmıyordu. Fakat kişilerin sorgulama yapması sırasında ki bir yoğun trafikten dolayı hata veriyordu. Bunun sonucunda da Sayfayı yenilemek durumunda kalıyorduk. Sonrasında Xajax ile tanıştım. Bu da Localhost 'umda Sorunsuz çalışıyordu. Fakat aynı yığılmanın önüne geçilememesini garipsedim (; Hani insan ihtiyacı olduğu şeylerin gözünün önünde bile olsa gözden kaçırır ya (; 3.0 Versiyonundan itibaren Kullandığım vBulletin 'in ajax sistemi dikkatimi çekti. Bu kadar yoğunlukta iken bile nasıl olurda %0 Sıfır hata ile AJAX çalıştırabilirdi? Ben Cevabı kendi gözlerimle gördüm. Düzenledim ve sizinle paylaşmak istedim (; vBulletin 'in kendine özgü programlaması nesneye dayalıdır. AJAX Kodları da aynı şekilde. Yalnızca Taşları yerli yerine oturtmanız gerekiyor... İşte vBulletin 'in ihtiyacımız olacak AJAX Kodları ( Tarafımdan Düzenlenmiştir, Birebir Benzerdir Fakat Nesne ve değişken adları değiştirildi ). Kod: /** * Tarayıcı Tanımlamarı * * @return boolean */ var ua = navigator.userAgent.toLowerCase(); var is_opera = ((ua.indexOf('opera') != -1) || (typeof(window.opera) != 'undefined')); var is_saf = ((ua.indexOf('applewebkit') != -1) || (navigator.vendor == 'Apple Computer, Inc.')); var is_webtv = (ua.indexOf('webtv') != -1); var is_ie = ((ua.indexOf('msie') != -1) && (!is_opera) && (!is_saf) && (!is_webtv)); var is_ie4 = ((is_ie) && (ua.indexOf('msie 4.') != -1)); var is_moz = ((!is_saf) && (navigator.product == 'Gecko')); var is_kon = (ua.indexOf('konqueror') != -1); var is_ns = ((ua.indexOf('compatible') == -1) && (ua.indexOf('mozilla') != -1) && (!is_opera) && (!is_webtv) && (!is_saf)); var is_ns4 = ((parseInt(navigator.appVersion) == 4) && (is_ns)); var is_mac = (ua.indexOf('mac') != -1); /** * Mouse İmlecin "El" Halinin Tanımalaması * Buna neden ihtiyaç olduğunu düşünürseniz, Internet Explorer 'ın eski versiyonları pointer 'ı anlamıyor. * * @return string */ var pointer_cursor = (is_ie ? 'hand' : 'pointer'); function do_an_e(eventobj) { if (!eventobj || is_ie) { window.event.returnValue = false; window.event.cancelBubble = true; return window.event; } else { eventobj.stopPropagation(); eventobj.preventDefault(); return eventobj; } } function array_push(a, value) { a[a.length] = value; return a.length; } function array_pop(a) { if (typeof a != 'object' || !a.length) { return null; } else { var response = a[a.length - 1]; a.length--; return response; } } function e_by_gum(eventobj) { if (!eventobj || is_ie) { window.event.cancelBubble = true; return window.event; } else { if (eventobj.target.type == 'submit') { eventobj.target.form.submit(); } eventobj.stopPropagation(); return eventobj; } } /** * ID Adından Objeyi Yakalama Bir nevi getElementById 'nin kısaltılmışı * * @param string Nesnenin ID Adı * @return string Nesnenin Kendisi */ function fetch_object(idname) { if (document.getElementById) { return document.getElementById(idname); } else if (document.all) { return document.all[idname]; } else if (document.layers) { return document.layers[idname]; } else { return null; } } /** * Belirtilen Koddan Tag Değerleri Arasındaki Bilgiyi alma * * @param nesne * @param tag adı * @return dizi */ function fetch_tags(parentobj, tag) { if (parentobj == null) { return new Array(); } else if (typeof parentobj.getElementsByTagName != 'undefined') { return parentobj.getElementsByTagName(tag); } else if (parentobj.all && parentobj.all.tags) { return parentobj.all.tags(tag); } else { return new Array(); } } /** * AJAX Kodları */ function AJAX_Global(async) { this.async = async ? true : false; } AJAX_Global.prototype.init = function() { try { this.handler = new XMLHttpRequest(); return (this.handler.setRequestHeader ? true : false); } catch(e) { try { this.handler = eval("new A" + "ctiv" + "eX" + "Ob" + "ject('Micr" + "osoft.XM" + "LHTTP');"); return true; } catch(e) { return false; } } }; AJAX_Global.prototype.is_compatible = function() { if (is_ie && !is_ie4) { return true; } else if (typeof XMLHttpRequest != 'undefined') { try { return XMLHttpRequest.prototype.setRequestHeader ? true : false; } catch(e) { try { var tester = new XMLHttpRequest(); return tester.setRequestHeader ? true : false; } catch(e) { return false; } } } else { return false; } }; AJAX_Global.prototype.not_ready = function() { return (this.handler.readyState && (this.handler.readyState < 4)); }; AJAX_Global.prototype.onreadystatechange = function(event) { if (!this.handler) { if (!this.init()) { return false; } } if (typeof event == 'function') { this.handler.onreadystatechange = event; } else { alert('AJAX OnreadyStateChange event \'i bir nesne değil!'); } }; AJAX_Global.prototype.send = function(desturl, datastream) { if (!this.handler) { if (!this.init()) { return false; } } if (!this.not_ready()) { this.handler.open('POST', desturl, this.async); this.handler.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); this.handler.send(datastream + '&s=' + fetch_random()); if (!this.async && this.handler.readyState == 4 && this.handler.status == 200) { return true; } } return false; }; AJAX_Global.prototype.fetch_data = function(xml_node) { if (xml_node && xml_node.firstChild && xml_node.firstChild.nodeValue) { AJAX_Global.prototype.fetch_data = function(xml_node) { if (xml_node && xml_node.firstChild && xml_node.firstChild.nodeValue) { var str = PHP.unescdata(xml_node.firstChild.nodeValue); var latin5 = new Array("ı","İ","ş","Ş","ö","Ö","ç","Ç","ü","Ü","ğ","Ğ"); var utf8 = new Array("ı","İ","ÅŸ","Åž","ö","Ö","ç","Ç","ü","Ü","ÄŸ","Äž"); for(i = 1; i <= latin5.length; i++) { str = str.replace(utf8[i],latin5[i]); } return str; } else { return ''; } } } else { return ''; } } var AJAX_Compatible = AJAX_Global.prototype.is_compatible(); /** * vBulletin 'in Javascript için PHP Emulatörü */ function PHP_Execute() { } PHP_Execute.prototype.ltrim = function(text) { return text.replace(/^\s+/g,''); }; PHP_Execute.prototype.rtrim = function(text) { return text.replace(/(\s+)/g,''); }; PHP_Execute.prototype.trim = function(text) { return this.ltrim(this.rtrim(text)); }; PHP_Execute.prototype.unescdata = function(text) { return text.replace(/<\=\!\=\[\=C\=D\=A\=T\=A\=\[/g,'<![CDATA[').replace(/\]\=\]\=>/g, ']]>'); }; PHP_Execute.prototype.in_array = function(ineedle, haystack, caseinsensitive) { var needle = new String(ineedle); if (caseinsensitive) { needle = needle.toLowerCase(); for (var i in haystack) { if (haystack[i].toLowerCase() == needle) { return i; } } } else { for (var i in haystack) { if (haystack[i] == needle) { return i; } } } return false; }; var PHP = new PHP_Execute(); /** * AJAX 'da kullanacağımız Rasgele Sayı */ function fetch_random() { var rand = Math.random() * 1894000000000000000000000000; return rand; } Bu Sistem Tek başına yeterli Değil. AJAX Sorgusunu, XML olarak alıyor. Yani bir de PHP XML Oluşturucu gerekiyor. vBulletin bunda da imdadımıza yetişiyor (; Onunda Kodları. Kod: class XML_Builder { var $charset = 'windows-1252'; var $content_type = 'text/xml'; var $open_tags = array(); var $tabs = ""; function XML_Builder($content_type = null, $charset = null) { if ($content_type) { $this->content_type = $content_type; } if ($charset == null) { $charset = $this->charset; } $this->charset = (strtolower($charset) == 'iso-8859-1') ? 'windows-1252' : $charset; } function send_content_type_header() { header('Content-Type: ' . $this->content_type . ($this->charset == '' ? '' : '; charset=' . $this->charset)); } function fetch_xml_tag() { return '<?xml version="1.0" encoding="' . $this->charset . '"?>' . "\n"; } function add_group($tag, $attr = array()) { $this->open_tags[] = $tag; $this->doc .= $this->tabs . $this->build_tag($tag, $attr) . "\n"; $this->tabs .= "\t"; } function close_group() { $tag = array_pop($this->open_tags); $this->tabs = substr($this->tabs, 0, -1); $this->doc .= $this->tabs . "</$tag>\n"; } function add_tag($tag, $content = '', $attr = array(), $cdata = false, $htmlspecialchars = false) { $this->doc .= $this->tabs . $this->build_tag($tag, $attr, ($content === '')); if ($content !== '') { if ($htmlspecialchars) { $this->doc .= htmlspecialchars_uni($content); } else if ($cdata OR preg_match('/[\<\>\&\'\"\[\]]/', $content)) { $this->doc .= '<![CDATA[' . $this->escape_cdata($content) . ']]>'; } else { $this->doc .= $content; } $this->doc .= "</$tag>\n"; } } function build_tag($tag, $attr, $closing = false) { $tmp = "<$tag"; if (!empty($attr)) { foreach ($attr AS $attr_name => $attr_key) { if (strpos($attr_key, '"') !== false) { $attr_key = htmlspecialchars_uni($attr_key); } $tmp .= " $attr_name=\"$attr_key\""; } } $tmp .= ($closing ? " />\n" : '>'); return $tmp; } function escape_cdata($xml) { $xml = preg_replace('#[\\x00-\\x08\\x0B\\x0C\\x0E-\\x1F]#', '', $xml); return str_replace(array('<![CDATA[', ']]>'), array('«![CDATA[', ']]»'), $xml); } function output() { if (!empty($this->open_tags)) { trigger_error("Dökümanda Tag hala açık görünüyor..."); return false; } return $this->doc; } function print_xml() { $this->send_content_type_header(); echo $this->fetch_xml_tag() . $this->output(); exit; } } function htmlspecialchars_uni($text, $entities = true) { return str_replace( // replace special html characters array('<', '>', '"'), array('<', '>', '"'), preg_replace( // translates all non-unicode entities '/&(?!' . ($entities ? '#[0-9]+' : '(#[0-9]+|[a-z]+)') . ';)/si', '&', $text ) ); } [Yanlizca 10 Saniyede Üye Olmak Için TIKLAYINIZ...] Tek Tag 'lı bir XML İstiyorsanız Kodları... xml.php içeriği.. Kod: <? require('./class_xml.php'); $xml = new XML_Builder; $xml->add_tag('deneme','DENEME TAGI'); $xml->print_xml(); ?> [Yanlizca 10 Saniyede Üye Olmak Için TIKLAYINIZ...] xml.php içeriği Kod: <? require('./class_xml.php'); $xml = new XML_Builder; $xml->add_group('Grup'); $xml->add_tag('grup1','DENEME GRUP1'); $xml->add_tag('grup2','DENEME GRUP2'); $xml->close_group(); $xml->print_xml(); ?> ÖRNEK1: Attribe 'ler de var fakat bu kadarı işimizi görecektir. Şimdi Dilerseniz Basit Bir AJAX Kullanalım... Önce AJAX için Dosyaları ve Nesne Adlarını Seçiyorum. AJAX Kodu için Dosyamın adı: ajax_say_alert.js olsun diyelim. AJAX Kodunu faliyete geçirek olan Nesne adı ise: AJAX_Alert_init olarak seçiyorum. Şimdi Tasarımımı oluşturabilirim. Tasarımın Genel Hali Kod: <html> <head> <title>AJAX Örneği 1</title> <link rel="**********" href="css/style.css" type="text/css"> <script type="text/javascript" src="ajax.js"></script> <script type="text/javascript" src="ajax_say_alert.js"></script> </head> <body> </br></br></br> <table cellpadding="0" cellspacing="0" align="center" class="border"> <tr> <td class="title" colspan="2" align="center">AJAX ÖRNEK</td> </tr> <tr> <td class="heading">Ey Bilgisayar! oraya yazdığım şeyi Bana söyle!</td> <td class="data"><input type="text" class="text" id="string"></td> </tr> <tr> <td class="title" colspan="2" align="center"> <input type="button" class="button" id="submit_button" value="AJAX a Gönder"> </td> </tr> </table> <script type="text/javascript"> <!-- AJAX_Alert_init(); //--> </script> </body> </html> Şimdi ajax_say_alert.js içeriğini oluşturalım... Kod: function AJAX_Alert_init() { //Tarayıcımız AJAX Kullanmaya Müsait mi ve "submit_button" id 'sinde bir Buton var mı? if (AJAX_Compatible && fetch_object('submit_button')) { //submit_button id'li Butonu Tıkladığımda; AJAX_Alert.prototype.on_click Nesnesini çalıştır. fetch_object('submit_button').onclick = AJAX_Alert.prototype.on_click; } } //Önce AJAX_Alert 'in bir nesne olabilmesi için genel fonksiyonu açıyoruz. function AJAX_Alert() { //AJAX için Gerekli... this.xml_sender = null; //Fonksiyon içinde fonksiyonda this kullanmamız hata verecektir. bu nedenle me 'ye aktardık var me = this; //AJAX 'tan gelen Sorgunun kontrolü this.ajax_response = function() { if (me.xml_sender.handler.readyState == 4 && me.xml_sender.handler.status == 200) { if (me.xml_sender.handler.responseXML) { //XML olarak Bilgiyi alabilmişsek Tag içerisindeki bilgiyi data değişkenine atıyoruz ve filtreliyoruz var data = me.xml_sender.fetch_data(fetch_tags(me.xml_sender.handler.responseXML,'SORGU')[0]); if (data) { //Bilgi Çıkışı alert(data); } } } }; } AJAX_Alert.prototype.on_click = function() { //string ID 'li element Değeri Boşsa if (fetch_object('string').value != '') { //Nesneyi Başlat var ALERT = new AJAX_Alert(); //AJAX 'ı çalıştır ALERT.alert_data(); } return false; }; //AJAX Çalıştırma.. AJAX_Alert.prototype.alert_data = function() { this.xml_sender = new AJAX_Global(true); //this.ajax_response Değişkenini burada kullanıyoruz this.xml_sender.onreadystatechange(this.ajax_response); //ajax.php 'ye post olarak gönderiyoruz. this.xml_sender.send('ajax.php','alertstring=' + fetch_object('string').value); }; Kod: <? if ($req = $_REQUEST['alertstring']) { require('./class/class_xml.php'); $xml = new XML_Builder; $xml->add_tag('SORGU',$req); $xml->print_xml(); } ?> |
| | |
| Sponsor Linkler (Lütfen Sitemize Destek Olmak İçin Günde Bir Kez Tıklayınız) | |
| | |
![]() |
| Paylaş |
| Etiketler |
| ajax, hatasiz, hatasız ajax kullanımı, kullanimi, turkce, türkçe |
| Seçenekler | |
| Stil | |
| |
Benzer Konular | ||||
| Konu | Konuyu Açan | Forum | Cevap | Son Mesaj |
| JQuery ile Ajax Kullanımı | Ceybi | JavaScript & AJAX | 0 | 15 Ocak 2012 14:29 |