2011-02-08 24 views
5

Wordpress özellikli bir mobil tema için jQuery Mobile çerçevesine geçmeye karar verdim.jQuery Mobile ve Form Gönderme

Şu anda URL'de karma etiketi olan formları gönderme ve doğrulama ve ajax gönderme yapmaya çalışıyorum. Temelde işe yaramıyor.

örn: website.com/contact/ < - website.com/#/contact/ < işleri - Ben # ortadan href yıllardan için rel = "external" etiketi farkındayım

çalışmıyor URL’den Ancak, "rel =" external "değerini kullanamayacağım formları imzalayan özel bir eklentiye sahip blog yayınlarım var. Sanırım tüm bağlantılar için kullanabilirdim ama bu yumuşak geçişleri ortadan kaldıracaktır.

Çalışmak için bunu denemek için seçeneklerim nelerdir? .submit'i forma bağlamaya çalışıyorum, bazı doğrulama yapın ve sonra ajax gönderin.

Update--

<form id="myform" action="myfile.php" method="post"> 
<input type="text" id="mytext" name="mytext" /> 
<input type="submit" id="myform_submit" value="Submit"> 
</form> 

ve benim komut dosyası:

jQuery(document).ready(function() { 
jQuery("#contact_submit").submit(function(){ 
     alert('WTF'); 
     }); 
}); 

Değişti olduğu için:

<form id="myform" action="myfile.php" method="post"> 
<input type="text" id="mytext" name="mytext" /> 
<input type="button" id="myform_submit" value="Submit"> 
</form> 

ve benim senaryo:

jQuery(document).ready(function() { 
jQuery("#contact_submit").click(function(){ 
     alert('WTF'); 
     }); 
}); 

Her ikisi de URL'de # ile çalışmıyor.

Ben de jquery.mobile.js dosyası ÖNCE bu ekledi:

<script type="text/javascript"> 
jQuery(document).bind(
    "mobileinit", function(){ 
    jQuery.extend(jQuery.mobile, { ajaxFormsEnabled: false }); 
    }); 
</script> 

Hala gitmek.

--another güncelleme ($ yerine Bilginize jQuery çünkü WordPress taşımaktadır).

WordPress'i kullandığımdan beri bazı işlevler garip davranıyor. Is_home() gibi. İşlevde ne 'olursa olsun' işlevi, gerçek olarak geri gelir. Bunun her sayfa için ajax çağrıları ile ilgili olduğunu düşünüyorum.

cevap

2

AJAX sarmayı kapatabilirsiniz. Ben slashesle sorunlar hakkında bir şey görmüştüm, ama şimdi bulamıyorum, bu yüzden

[değiştir]

Bu JQM

ait alpha3 sürümünü kullandığınızdan emin olun - Ayrıca http://jquerymobile.com/demos/1.0a3/#docs/api/globalconfig.html

: Burada Oku Daha önce birkaç kez bahsedildi - diğer bazı konularda. Eğer bir sayfaya giderseniz ve JQM onu AJAX ile yüklerse, o zaman sadece body alınır ve YOK document.ready zaten dom hazır olduğu için yangın yapar.) (Kendime burada alıntı yapıyorum)

+0

Bunun olup olmadığından emin değil. değerini olarak değiştirdim ve yalnızca bir uyarı ile bir tıklama işleyicisi ekledim. Hayır, URL'de # ile git. Onsuz paradır. – jdruid

+0

Form ile uğraşmayı denemeyin. AJAX'ı devre dışı bırakmak çalışmalıdır. Sürümlerle deneme yapmayı deneyebilirsiniz - jqm alpha2 ve alpha3 ile çalışmayı karşılaştırın (dikkat: alpha2 farklı ayarlara sahipti) – naugtur

+0

Hmm. JQuery'yi bir kaç tane daha yayınlanana kadar bekleyebilirim. AJAX'ı devre dışı bıraktım ama hala hayır şansı. URL'de # olmadan çalışır. Bu bir kez orada yok. Bunun web tarayıcısında yerleşik bir güvenlik görevi olduğunu varsayıyorum. :( – jdruid

7

Tamamen değilim jQuery.ready işlevini çağırdığınız ancak işleyicileri kaydettirmenin önerilen yolunun, belirli sayfalarınız için pagecreate etkinliğine bağlanmasıdır. pagecreate olayları, yalnızca ilk sayfada jQuery.ready tarafından ele alınmalıdır.Geçenlerde jQuery mobile kullanarak bir site kurdum ve tam olarak bu problemle karşılaştım.

jQuery(document).ready(function() { 
    $("#id_of_page").live('pagecreate', function() { 
     $("form").submit(function(event) { 
      event.stopPropagation(); 
      event.preventDefault(); 

      // Do stuff here (usually AJAX); 

      return false; 
     }); 
    }); 
}); 

Ne yazık ki, bütün bunlar gerekli olup olmadığını belirlemek için yeterli deney yapmadı: Olmak istediğiniz yere aşağıdaki kod almak gerekir. Bunun benim için hile yaptığını biliyorum. Neredeyse return false'u AJAX tarafından işlenen tüm form gönderimlerime hemen ekledim. Umarım bu yardım!

+1

FYI: muhtemelen 'pagecreate' yerine' pageinit 'istiyor (http://jquerymobile.com/demos/1.1.1/docs/api/events.html) –