Flash/Flex Developer » jQuery http://blog.ismailsimsek.com Thu, 22 Dec 2011 14:58:55 +0000 en hourly 1 http://wordpress.org/?v=3.3 jquery ile php den dönen veriyi almak – kontrol etmek http://blog.ismailsimsek.com/php/jquery-ile-php-den-donen-veriyi-almak-kontrol-etmek.html http://blog.ismailsimsek.com/php/jquery-ile-php-den-donen-veriyi-almak-kontrol-etmek.html#comments Fri, 02 Jul 2010 13:37:30 +0000 İsmail Şimşek http://blog.ismailsimsek.com/?p=169 Merhaba arkadaşlar. Makalenin başlığından da anlaşılacağı gibi jquery ile php den dönen veriyi nasıl alabileceğimize değineceğim. Aslında bu makaleyi başıma gelen bir sorunun çözümüne ulaştıktan sonra yazıyorum. Yardımları için Şakir Şensoy ve Göksu Kayış’a teşekkür ederim.
Başıma gelen şuydu. Jquery uploadify componenti ile hosta resim yüklüyorum. Eğer işlem başarılı ise 1 değilse 0 aynı resim varsa 2 dönüyor. Tabi bu dönen verilere göre kullanıcıya bir uyarı vermek zorundayım. Bunları kontrol etmek için dönen veriyi if le kontrol edip alert ile uyarıyı vereceğim. Bu konuda sorun yok. Ama dönen veriyi if ile kontrol edemiyordum. Ne yaptıysam olmadı. Ama verinin döndüğünden eminim :)
Çözüm ise çok basitmiş. (normal bir ajax request i için yazıyorum kodları. Uploadify için bir satır daha ekleyeceğiz.) Yapmanız gereken şey şu. Php tarafında veriyi json şeklinde göndermek. Yani

PLAIN TEXT
PHP:
  1. if (resimUpload == TRUE)
  2. {
  3. $json = array(
  4. "sonuc" => “1”,
  5. "mesaj" => "Yükleme yapıldı."
  6. );
  7. echo json_encode($json);
  8. }

jquery kısmıda şu kodlar var.

PLAIN TEXT
JavaScript:
  1. function uye_giris()
  2. {
  3.     $.ajax({
  4.         type         : 'POST',
  5.         dataType     : 'json',
  6.         url          : upload.php',
  7.         data         : $('form#resim_sonuc’).serialize(),
  8.         success      : function(data) {
  9.                             if (data.giris == “1”)   {
  10.                                 alert(JSON.mesaj);
  11.                             }
  12.                           }
  13.        });
  14.        return false;
  15. }

İşte bu kadar. Bu şekilde dönen veriyi, verileri istediğimiz gibi kullanabiliyoruz. Json sayesinde birden fazla veride döndürebiliyoruz.
Gelelim uploadify ile ilgili olan kısma. Bu component ile dayatype belirleyemiyorum maalesef. Bu durumda dönen verinin json olduğunu ya bizim bildirmemiz lazım yada ona göre bir işlem yapmamız lazım. Dönen veriyi if ile kontrol etmeden önce şunu yazmamız lazım.

PLAIN TEXT
JavaScript:
  1. eval(“var obj =” + data);

bu şekilde dönen veriyi bir object e atmış olduk. Şimdi aynı şekilde kullanabiliriz. İyi çalışmalar.

]]> http://blog.ismailsimsek.com/php/jquery-ile-php-den-donen-veriyi-almak-kontrol-etmek.html/feed 0 jQuery validation plugin ile form validation http://blog.ismailsimsek.com/genel/pratik-bilgiler/jquery-validation-plugin-ile-form-validation.html http://blog.ismailsimsek.com/genel/pratik-bilgiler/jquery-validation-plugin-ile-form-validation.html#comments Fri, 22 Jan 2010 00:40:34 +0000 İsmail Şimşek http://blog.ismailsimsek.com/?p=138 jQuery nin çok işe yarar bir plugin inden bahsedeceğim. Formları kontrol etmek doğru verinin girilip girilmediğini denetlemek çok büyük sıkıntı benim için. Hazırladığım bir formun kontrolü için araştırma yaparken karşıma çıkan bu güzel plugin tüm sorunlarımı kafamdan atmama neden oldu :)

Hemen kullanımına geçiyorum. Öncelikle şu adresten indirelim. İndirdiğimiz zip dosyasının içindeki jquery.validate.min.js dosyasını kullanacağız. İsterseniz jquery.validate.js ya da jquery.validate.pack.js dosyasını da kullanabilirsiniz.

Önce bu kütüphaneyi sayfamıza ekleyelim.

PLAIN TEXT
JavaScript:
  1. <script type="text/javascript" src="jquery132.js"></script>
  2. <script type="text/javascript" src="jquery.validate.min.js"></script>

Daha sonra sayfamız açıldığında hemen çalışmaya başlayacak olan validation kodlarını yazalım.

Kullanacağımız formun html kodları:

PLAIN TEXT
HTML:
  1. <form id="form1">
  2. <table border="1">
  5. <td>İsim</td>
  6. <td><input id="isim" name="isim" type="text" /></td>
  7. </tr>
  9. <td>Numara</td>
  10. <td><input id="numara" name="numara" type="text" /></td>
  11. </tr>
  13. <td>Email</td>
  14. <td><input id="email" name="email" type="text" /></td>
  15. </tr>
  17. <td colspan="2" align="right"><input onclick="kontrolet()" type="button" value="Kontrol Et" /></td>
  18. </tr>
  19. </tbody>
  20. </table>
  21. </form>

Bu uygulamamızda formumuzun adı ve id si form1. Ayrıca formun içinde isim, numara ve email alanları bulunmakta.

PLAIN TEXT
JavaScript:
  1. <script type="text/javascript">
  2. $(document).ready(function() {
  3. $('#form1').validate({
  4. rules: {
  5. isim: { required: true, minlength:5 },
  6. numara: { required: true, number:true },
  7. email: { required: true, email: true }
  8. },
  9. messages: {
  10. isim: { required: 'Lütfen bu alanı doldurunuz.',minlength:'5 karakterden daha az giremezsiniz.'  },
  11. numara: { required: 'Bu alanı doldurmak zorundasınız.',number:'sadece numara girilebilir.' },
  12. email: { required: 'Lütfen bu alanı doldurunuz.' , email: 'Lütfen geçerli bir email adresi giriniz.' }
  13. }
  14. });
  15. });
  16. </script>

Şimdi tüm bu kodlar ne işe yarıyor biraz ondan bahsedeyim. Döküman hazır olduğunda form1 nesnesi validation için yakalanıyor ve kontrol ediliyor :) required komutu ilgili alanı doldurmak zorunda olduğumuzu belirtiyor. Default değeri false. Bunun dışında number, minlength, maxlength, email gibi özelliklerde var. Bu kodları yazdırdıktan sonra eğer formumuz doğru doldurulmuşsa işlem yaptırmak istiyoruz. Bunun içinde şu kodları kullanacağız.

PLAIN TEXT
JavaScript:
  1. <script type="text/javascript">
  2. function kontrolet()
  3. {
  4. sonuc = $('#form1').valid();
  5. if(sonuc==true)    {
  6. alert("Form başarıyla dolduruldu.")
  7. }else{
  8. alert("Lütfen gerekli alanları doldurunuz.");
  9. }
  10. }
  11. </script>

Çalışmanın derli toplu haline buradan ulaşabilirsiniz.

Bu plugin hakkında daha çok bilgi için:
http://docs.jquery.com/Plugins/Validation
http://jquery.bassistance.de/validate/demo/

]]> http://blog.ismailsimsek.com/genel/pratik-bilgiler/jquery-validation-plugin-ile-form-validation.html/feed 1