प्रोटोटाइप से jQuery में कनवर्ट

वोट
2

मैं एक php फ़ाइल है कि एक mysql डेटाबेस से डेटा हो जाता है से एक div का एक सरल ajax अद्यतन करने के लिए कोशिश कर रहा हूँ। एक समारोह div भरता है, अन्य डेटाबेस को संदेश में जोड़ता है और एक सबमिट बटन के क्लिक पर कहा जाता है। मैं सोच रहा था अगर किसी jQuery में मुझे उनके समकक्ष दे सकता है। नीचे प्रोटोटाइप संस्करण हैं।

<script>
function getMessages(){
  new Ajax.Updater('chat','messages.php', {
    onSuccess:function(){
      window.setTimeout( getMessages, 3000 );
    }
  });
}
getMessages();
</script>

<script>
function addmessage(){
  new Ajax.Updater('chat','add.php',{
    method:'post',
    parameters: $('chatmessage').serialize(),
    onSuccess: function() {
      $('messagetext').value = '';
    }
  });
}
</script>
21/02/2009 को 02:45
का स्रोत उपयोगकर्ता
अन्य भाषाओं में...                            


2 जवाब

वोट
9

JQuery .ajax () कॉल यह सब करता है। () यह .Get की तरह कम मानकों (साथ रैपर) .post है, और .load () है कि आपको कम वर्बोज़ वाक्य रचना के लिए उपयोग कर सकते हैं।

आप का उल्लेख नहीं है क्या प्रारूप डेटा तक वापस पहुंचने में। आप .ajax () कॉल में निर्दिष्ट करने की आवश्यकता है। मोटे तौर पर:

function addMessage(message) {
  $.ajax({
    url: 'add.php',
    success: function() {
      $("#chatmessage").text('');
    },
    error: function() { ... },
    timeout: 3000,
    data: {
      message: message
    } 
  });
 }

function getMessages() {
  $.ajax({
    url: 'messages.php',
    dataType: 'html',
    timeout: 3000,
    error: function() { ... },
    success: function(data) {
      $("#messages").html(data);
    }
  });
}

नोट: डेटाप्रकार पैरामीटर सिर्फ मैच के लिए जो कुछ भी स्क्रिप्ट का उत्पादन की जरूरत है। यदि messages.php पैदा करता है, का कहना है कि संदेशों के एक HTML सूची तो यह डेटाप्रकार "html" करने के लिए निर्धारित किया है। अगर ऐसा है, तो आप भी करने के लिए कोड को आसान बनाने में कर सकते हैं:

function getMessages() {
  $("#messages").load("message.php");
}

नोट: लोड () फ़ंक्शन .ajax चारों ओर सिर्फ एक आवरण है ()। का प्रयोग करें .ajax () आप समय समाप्ति, त्रुटि हैंडलिंग, उदाहरण के लिए आदि जैसी चीजों निर्धारित करने की आवश्यकता है, तो:

<div id="messages"></div>
<input type="button" id="getmessages" value="Get Messages">
...
<script type="text/javascript">
$(function() {
  $("#getmessages").click(function() {
    $(this).attr("disabled", "true");
    $.ajax({
      url: 'message.php',
      dataType: "html",
      timeout: 5000,
      error: function() {
        alert("Error talking to server.");
        $(this).attr("disabled", "false");
      },
      success: function(data) {
        $("#messages").html(data);
        $(this).attr("disabled", "false");
      }
    });
  });
});
</script>

इसके बाद के संस्करण एक संपूर्ण उदाहरण है और आप के लिए अतिरिक्त पैरामीटर का उपयोग कर सकते हैं की एक विचार देना चाहिए। आप उन्हें जरूरत नहीं है तो बस आशुलिपि संस्करण का उपयोग करें।

21/02/2009 को 02:53
का स्रोत उपयोगकर्ता

वोट
1
$.ajax({
    type: "GET",
    url: "messages.php",
    data: "name=John&location=Boston",
    success: function(){
        window.setTimeout(getMessages,3000);
    }
});

दूसरा addmessage के लिए

$.ajax({
    type: "POST",
    url: "add.php",
    data: $('#chatmessage').param(),
    success: function() {
        $('messagetext').value = '';
    }
});

अधिक जानकारी के लिए पर एक नजर है http://docs.jquery.com/Ajax

21/02/2009 को 02:55
का स्रोत उपयोगकर्ता

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more