$ Ajax POST में पैरामीटर कैसे पास करें?


135

मैंने इस लिंक में बताए गए ट्यूटोरियल का अनुसरण किया है । किसी कारण से नीचे दिए गए कोड में डेटा को यूआरएल को पैरामीटर के रूप में नहीं जोड़ा जाता है, लेकिन अगर मैं उन्हें सीधे यूआरएल के साथ /?field1="hello"काम करता हूं ।

$.ajax({
        url: 'superman',
        type: 'POST',
        data: { field1: "hello", field2 : "hello2"} ,
        contentType: 'application/json; charset=utf-8',
        success: function (response) {
            alert(response.status);
        },
        error: function () {
            alert("error");
        }
    }); 

8
यदि आप URL के लिए अपने Params की तलाश कर रहे हैं, तो आपको टाइप करके 'GET' में बदलना होगा। 'POST' इसके बजाय HTTP हेडर में पैरामीटर पारित करेगा।
लूटना

जवाबों:


126

मैं आपको सरल मामलों के लिए jQuery के $.postया $.getसिंटैक्स का उपयोग करने की सलाह दूंगा:

$.post('superman', { field1: "hello", field2 : "hello2"}, 
    function(returnedData){
         console.log(returnedData);
});

यदि आपको असफल मामलों को पकड़ने की जरूरत है, तो बस यह करें:

$.post('superman', { field1: "hello", field2 : "hello2"}, 
    function(returnedData){
         console.log(returnedData);
}).fail(function(){
      console.log("error");
});

इसके अतिरिक्त, यदि आप हमेशा एक JSON स्ट्रिंग भेजते हैं, तो आप $ .getJSON या $ .post का उपयोग बहुत अंत में एक और पैरामीटर के साथ कर सकते हैं ।

$.post('superman', { field1: "hello", field2 : "hello2"}, 
     function(returnedData){
        console.log(returnedData);
}, 'json');

1
JQuery समर्थन के नए संस्करणों ने एक किया ('),' फेल '(या हमेशा) () हैंडलर को $ .ost और $। देखें: api.jquery.com/jQuery.post
CyberMonk

क्या है field1:और क्या है "hello"? जेएस या PHP में चर?
MTBthePRO

फ़ील्ड 1 और फ़ील्ड 2 POST चर हैं। हैलो और हैलो 2 उनके मूल्य हैं।
अल्वारो

57

GET विधि का उपयोग करके देखें,

var request = $.ajax({
    url: 'url',
    type: 'GET',
    data: { field1: "hello", field2 : "hello2"} ,
    contentType: 'application/json; charset=utf-8'
});

request.done(function(data) {
      // your success code here
});

request.fail(function(jqXHR, textStatus) {
      // your failure code here
});

आप POST विधि के साथ URL में पैरामीटर नहीं देख सकते हैं।

संपादित करें:

पदावनति सूचना: jqXHR.success (), jqXHR.error (), और jqXHR.complete () कॉलबैक jQuery 3.0 के रूप में हटा दिए जाते हैं। आप इसके बजाय jqXHR.done (), jqXHR.fail (), और jqXHR.always () का उपयोग कर सकते हैं।


53

Jquery.ajax आपके लिए POST डेटा को स्वचालित रूप से एनकोड नहीं करता है जिस तरह से यह GET डेटा के लिए करता है। जक्वेरी को उम्मीद है कि आपके डेटा को तार के आर-पार भेजने के लिए अनुरोध निकाय को पूर्व-निर्धारित किया जाएगा।

एक समाधान jQuery.param फ़ंक्शन का उपयोग करने के लिए एक क्वेरी स्ट्रिंग बनाने के लिए होता है जो POST अनुरोधों की अपेक्षा करने वाली अधिकांश लिपियों की प्रक्रिया करता है।

$.ajax({
    url: 'superman',
    type: 'POST',
    data: jQuery.param({ field1: "hello", field2 : "hello2"}) ,
    contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
    success: function (response) {
        alert(response.status);
    },
    error: function () {
        alert("error");
    }
}); 

इस स्थिति में paramविधि डेटा को प्रारूपित करती है:

field1=hello&field2=hello2

Jquery.ajax प्रलेखन कहते हैं एक ध्वज कहा जाता है कि वहाँ processDataकि नियंत्रण इस एन्कोडिंग स्वचालित रूप से या नहीं किया है या नहीं। प्रलेखन कहता है कि यह चूक करता है true, लेकिन यह वह व्यवहार नहीं है जिसका मैं POSTउपयोग करते समय निरीक्षण करता हूं ।


7
मुझे लगता है कि यह एकमात्र उत्तर है जो 'क्यों' की व्याख्या करता है।
झोउजी

15
    function FillData() {
    var param = $("#<%= TextBox1.ClientID %>").val();
    $("#tbDetails").append("<img src='Images/loading.gif'/>");
    $.ajax({
        type: "POST",/*method type*/
        contentType: "application/json; charset=utf-8",
        url: "Default.aspx/BindDatatable",/*Target function that will be return result*/
        data: '{"data":"' + param + '"}',/*parameter pass data is parameter name param is value */
        dataType: "json",
        success: function(data) {
               alert("Success");
            }
        },
        error: function(result) {
            alert("Error");
        }
    });   
}

11

एक में पोस्ट अनुरोध , मानकों अनुरोध के शरीर, है यही कारण है कि आप URL में उनका नहीं दिख रहा है में भेजा जाता है।

अगर आप उन्हें देखना चाहते हैं, तो बदलिए

    type: 'POST',

सेवा

    type: 'GET',

ध्यान दें कि ब्राउज़रों में विकास उपकरण हैं जो आपको अपने कोड के मुद्दों के पूर्ण अनुरोधों को देखने की सुविधा देते हैं। क्रोम में, यह "नेटवर्क" पैनल में है।


8
$.ajax(
   {
      type: 'post',
      url: 'superman',
      data: { 
        "field1": "hello",
        "field2": "hello1"
      },
      success: function (response) {
        alert("Success !!");
      },
      error: function () {
        alert("Error !!");
      }
   }
);

type: 'POST', अनुरोध के शरीर में ** मापदंडों को जोड़ देगा ** जो URL में नहीं देखा गया है, जबकि दिखाई देने वाले URL पर मापदंडों को जोड़ता है ।type: 'GET'

अधिकांश लोकप्रिय वेब ब्राउज़र में नेटवर्क पैनल होते हैं जो पूरा अनुरोध प्रदर्शित करता है ।

नेटवर्क पैनल में अनुरोध देखने के लिए XHR का चयन करें ।

इसके माध्यम से भी किया जा सकता है।

$.post('superman',
      { 
        'field1': 'hello', 
        'field2': 'hello1'
      },
      function (response) {
        alert("Success !");
      }
    );

6

आप इसे $ .ajax या $ .post का उपयोग करके कर सकते हैं

$ .Jax का उपयोग करना:

    $.ajax({
      type: 'post',
      url: 'superman',
      data: { 
        'field1': 'hello', 
        'field2': 'hello1'
      },
      success: function (response) {
        alert(response.status);
      },
      error: function () {
        alert("error");
      }
   });

$ .Post का उपयोग करना:

    $.post('superman',
      { 
        'field1': 'hello', 
        'field2': 'hello1'
      },
      function (response, status) {
        alert(response.status);
      }
    );

बहुत बहुत धन्यवाद - इसका काम। फिर भी, यह बहुत अच्छा होगा यदि आप एक उदाहरण जोड़ सकते हैं जो पोस्ट मापदंडों को प्राप्त करने के लिए फ़ंक्शन को कॉल करता है। धन्यवाद! :)
gies0r

3

आपका कोड सही था सिवाय इसके कि आप JSON कुंजी को स्ट्रिंग्स के रूप में पास नहीं कर रहे हैं।

इसके चारों ओर दोहरे या एकल उद्धरण होने चाहिए

{"फ़ील्ड 1": "हैलो", "फ़ील्ड 2": "हैलो 2"}

$.ajax(
   {
      type: 'post',
      url: 'superman',
      data: { 
        "field1": "hello", // Quotes were missing
        "field2": "hello1" // Here also
      },
      success: function (response) {
        alert(response);
      },
      error: function () {
        alert("error");
      }
   }
);

0

Url को POSTविधि में पैरामीटर भेजने के लिए आप इसे इस तरह url में जोड़ सकते हैं:

$.ajax({
    type: 'POST',
    url: 'superman?' + jQuery.param({ f1: "hello1", f2 : "hello2"}),
    // ...
}); 

2
यदि प्रश्नकर्ता केवल POST के माध्यम से कुछ पैरामेट्स भेजना चाहता है, तो अन्य उत्तर अधिक उपयुक्त होंगे, क्योंकि यह अधिक मानक होगा। इस प्रश्न में स्पष्ट रूप से POST और URL params का उल्लेख है। (उदा। मुझे यह प्रश्न इसलिए मिला क्योंकि मुझे URL params को पूरी तरह से शरीर में मौजूद लोगों के साथ सेट करना है, और मैं इसे समवर्ती तरीके से बेहतर तरीके से करना चाहूंगा।) @ user4127 इसे इस प्रश्न के उत्तर के रूप में स्वीकार करते हैं या कृपया सुधार करते हैं।
Jan Molnar
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.