jquery - सफलता पर अजाक्स परिणाम का उपयोग करके वापसी मूल्य

Question 1

मुझे jquery $ .ajax () फ़ंक्शन के साथ एक छोटी सी समस्या है।

मेरे पास एक ऐसा फॉर्म है जहां रेडियो बटन पर प्रत्येक क्लिक या ड्रॉपडाउन मेनू से चयन चयनित मान के साथ एक सत्र चर बनाता है।

अब - मेरे पास ड्रॉपडाउन मेनू में से एक है जिसमें 4 विकल्प हैं - पहले एक (लेबल नहीं के साथ) का एक मूल्य है = "" अन्य में अपना आईडी है।

जो मैं करना चाहता हूं वह सत्र को हटाने के लिए और खाली करने के लिए कोई विकल्प नहीं है (रिक्त मान के साथ), लेकिन केवल अगर यह विशिष्ट चयनित नाम वाला सत्र पहले से मौजूद नहीं है - क्योंकि अन्य सभी विकल्पों में एक ही राशि है जो इसे सौंपा गया है - यह सिर्फ संकेत दे रहा है कि कौन सा चुना गया था।

मुझे यकीन नहीं है कि अगर यह समझ में आता है - लेकिन कोड पर एक नज़र है - शायद यह इसे स्पष्ट कर देगा:

$("#add_ons select").change(function() {
        // get current price of the addons
        var order_price_addon = $(".order_price_addon").text();
        // get price of the clicked radio button from the rel attribute
        var add = $(this).children('option').attr('label');
        var name = $(this).attr('name');
        var val = $(this).val();


        if(val == "") {
            var price = parseInt(order_price_addon) - parseInt(add);
            removeSession(name);
        } else {
            if(isSession(name) == 0) {
                var price = parseInt(order_price_addon) + parseInt(add);
            }   
            setSession(name, val);              
        }

        $(".order_price_addon").html(price);    
        setSession('order_price_addon', price);         
        updateTotal();
});

इसलिए - सबसे पहले जब #add_ons मेनू मेनू "परिवर्तन" का चयन करता है, तो हमें गणना के लिए कुछ तत्वों से कुछ मूल्य मिलते हैं।

हमें अपने चयन से विकल्प की लेबल विशेषता मिलती है, जो कुल में जोड़े जाने वाले मूल्य को संग्रहीत करता है, इस नाम के साथ सत्र बनाने के लिए चयन का नाम और बाद में जांच करने के लिए मूल्य जो एक चुना गया था।

अब - हम जांचते हैं कि क्या घाटी == "" (जो इंगित करेगा कि कोई भी विकल्प नहीं चुना गया है) और हम कुल से राशि काटते हैं और साथ ही सेलेक्ट के नाम के साथ सत्र हटाते हैं।

इसके बाद जहां समस्या शुरू होती है - वहीं बयान।

Else - हम यह जाँचना चाहते हैं कि क्या isSession () हमारे चयनकर्ता के नाम के साथ कार्य करता है 0 या 1 - यदि यह 0 देता है तो हम लेबल विशेषता में संग्रहीत मान को जोड़ते हैं, लेकिन यदि यह 1 रिटर्न देता है - तो यह सुझाव देगा वह सत्र पहले से ही मौजूद है - फिर हम केवल इस सत्र का मान बदलकर इसे बदल देते हैं - लेकिन इसमें राशि नहीं जोड़ी जाती है।

अब पेशे समारोह इस तरह दिखता है:

function isSession(selector) {
    $.ajax({
        type: "POST",
        url: '/order.html',
        data: ({ issession : 1, selector: selector }),
        dataType: "html",
        success: function(data) {
            return data;
        },
        error: function() {
            alert('Error occured');
        }
    });
}

अब - समस्या यह है - कि मैं नहीं जानता कि क्या "वापसी" का उपयोग करने से फ़ंक्शन से परिणाम वापस आ जाएगा - क्योंकि यह काम नहीं करता है - हालांकि, अगर मैंने सफलता में "डेटा" डाला: अनुभाग में चेतावनी - यह सही मान लौटाता है।

क्या किसी को पता है कि फ़ंक्शन से मान कैसे लौटाएं और फिर अगले बयान में इसकी तुलना करें?

धन्यवाद दोस्तों - मैंने इसे निम्नलिखित तरीके से आज़माया है:

function isSession(selector) {
    $.ajax({
        type: "POST",
        url: '/order.html',
        data: ({ issession : 1, selector: selector }),
        dataType: "html",
        success: function(data) {
            updateResult(data);
        },
        error: function() {
            alert('Error occured');
        }
    });
}

फिर updateResult () फ़ंक्शन:

function updateResult (data) {result = data; }

परिणाम - वैश्विक चर है - जिसे मैं फिर पढ़ने की कोशिश कर रहा हूं:

$("#add_ons select").change(function() {
        // get current price of the addons
        var order_price_addon = $(".order_price_addon").text();
        // get price of the clicked radio button from the rel attribute
        var add = $(this).children('option').attr('label');
        var name = $(this).attr('name');
        var val = $(this).val();


        if(val == "") {
            var price = parseInt(order_price_addon) - parseInt(add);
            removeSession(name);
        } else {
            isSession(name);
            if(result == 0) {
                var price = parseInt(order_price_addon) + parseInt(add);
            }   
            setSession(name, val);              
        }

        $(".order_price_addon").html(price);    
        setSession('order_price_addon', price);         
        updateTotal();
    });

लेकिन किसी कारण से - यह काम नहीं करता है - कोई विचार?

Question 2

मुसीबत यह है कि आप एक AJAX अनुरोध की तरह एक अतुल्यकालिक कॉल से एक मूल्य वापस नहीं कर सकते हैं, और यह काम करने की उम्मीद कर सकते हैं।

कारण यह है कि प्रतिक्रिया के लिए प्रतीक्षा कर रहे कोड को प्रतिक्रिया प्राप्त होने के समय तक निष्पादित किया जा चुका है।

इस समस्या के समाधान के लिए आवश्यक कोड को चलाने के लिए है अंदरsuccess: कॉलबैक। इस तरह यह dataउपलब्ध होने पर ही एक्सेस कर रहा है।

function isSession(selector) {
    $.ajax({
        type: "POST",
        url: '/order.html',
        data: ({ issession : 1, selector: selector }),
        dataType: "html",
        success: function(data) {
            // Run the code here that needs
            //    to access the data returned
            return data;
        },
        error: function() {
            alert('Error occured');
        }
    });
}

एक अन्य संभावना (जो प्रभावी रूप से एक ही बात है) आपके success:कॉलबैक के अंदर एक फ़ंक्शन को कॉल करना है जो डेटा उपलब्ध होने पर पास करता है।

function isSession(selector) {
    $.ajax({
        type: "POST",
        url: '/order.html',
        data: ({ issession : 1, selector: selector }),
        dataType: "html",
        success: function(data) {
                // Call this function on success
            someFunction( data );
            return data;
        },
        error: function() {
            alert('Error occured');
        }
    });
}

function someFunction( data ) {
    // Do something with your data
}

Question 3

JQuery AJAX प्रतिक्रिया पाने के कई तरीके हैं। मैं आपके साथ दो सामान्य दृष्टिकोण साझा कर रहा हूं:

प्रथम:

async = false का उपयोग करें और फ़ंक्शन के भीतर ajax-object लौटाएं और बाद में प्रतिक्रिया ajax-object.responseText प्राप्त करें

/**
 * jQuery ajax method with async = false, to return response
 * @param  {mix}  selector - your selector
 * @return {mix}           - your ajax response/error
 */
function isSession(selector) {
    return $.ajax({
        type: "POST",
        url: '/order.html',
        data: {
            issession: 1,
            selector: selector
        },
        dataType: "html",
        async: !1,
        error: function() {
            alert("Error occured")
        }
    });
}
// global param
var selector = !0;
// get return ajax object
var ajaxObj = isSession(selector);
// store ajax response in var
var ajaxResponse = ajaxObj.responseText;
// check ajax response
console.log(ajaxResponse);
// your ajax callback function for success
ajaxObj.success(function(response) {
    alert(response);
});

दूसरा:

$ .extend विधि का उपयोग करें और ajax की तरह एक नया कार्य करें

/**
 * xResponse function
 *
 * xResponse method is made to return jQuery ajax response
 * 
 * @param  {string} url   [your url or file]
 * @param  {object} your ajax param
 * @return {mix}       [ajax response]
 */
$.extend({
    xResponse: function(url, data) {
        // local var
        var theResponse = null;
        // jQuery ajax
        $.ajax({
            url: url,
            type: 'POST',
            data: data,
            dataType: "html",
            async: false,
            success: function(respText) {
                theResponse = respText;
            }
        });
        // Return the response text
        return theResponse;
    }
});

// set ajax response in var
var xData = $.xResponse('temp.html', {issession: 1,selector: true});

// see response in console
console.log(xData);

आप इसे जितना चाहें उतना बड़ा बना सकते हैं ...

Question 4

मैंने यहाँ उत्तर देखे और हालांकि मददगार थे, वे ठीक वैसा नहीं थे जैसा मैं चाहता था क्योंकि मुझे अपने कोड में बहुत बदलाव करना था।

मेरे लिए क्या काम किया, कुछ इस तरह कर रहा था:

function isSession(selector) {
    //line added for the var that will have the result
    var result = false;
    $.ajax({
        type: "POST",
        url: '/order.html',
        data: ({ issession : 1, selector: selector }),
        dataType: "html",
        //line added to get ajax response in sync
        async: false,
        success: function(data) {
            //line added to save ajax response in var result
            result = data;
        },
        error: function() {
            alert('Error occured');
        }
    });
    //line added to return ajax response
    return result;
}

आशा किसी की मदद करती है

एनाकिन

Question 5

यद्यपि इसके उपयोग के संबंध में सभी दृष्टिकोण async: falseअच्छे नहीं हैं क्योंकि इसके अपव्यय के कारण पेज अटका हुआ है और अनुरोध वापस नहीं आता है। इस प्रकार यह करने के 2 तरीके हैं:

पहला: किसी फ़ंक्शन में संपूर्ण ajax प्रतिक्रिया लौटाएं और फिर doneअनुरोध पूरा होने पर प्रतिक्रिया पर कब्जा करने के लिए फ़ंक्शन का उपयोग करें । (सिफारिश, सबसे अच्छा तरीका)

function getAjax(url, data){
    return $.ajax({
        type: 'POST',
        url : url,              
        data: data,
        dataType: 'JSON',
        //async: true,  //NOT NEEDED
        success: function(response) {
            //Data = response;
        }
    });
 }

कॉल की तरह:

getAjax(youUrl, yourData).done(function(response){
    console.log(response);
});

मल्टीपल AJAX कॉल के लिए उपयोग करें $.when:

$.when( getAjax(youUrl, yourData), getAjax2(yourUrl2, yourData2) ).done(function(response){
    console.log(response);
});

दूसरा: कुकी में प्रतिक्रिया को संग्रहीत करें और फिर ajax कॉल के बाहर उस कुकी मान को प्राप्त करें। (अनुशंसित नहीं)

        $.ajax({
            type: 'POST',
            url : url,              
            data: data,
            //async: false,    // No need to use this
            success: function(response) {
                Cookies.set(name, response);
            }
        });

        // Outside of the ajax call
        var response = Cookies.get(name);

नोट:jquery cookies पुस्तकालय से ऊपर छूट में प्रयोग किया जाता है। यह काफी हल्का है और तड़क के रूप में काम करता है। यहाँ लिंक https://github.com/js-cookie/js-cookie है

Question 6

async: falseअपनी विशेषता सूची में जोड़ें । यह जावास्क्रिप्ट थ्रेड को प्रतीक्षा करने के लिए मजबूर करता है जब तक कि वापसी मूल्य को आगे बढ़ने से पहले पुनर्प्राप्त नहीं किया जाता है। जाहिर है, आप हर परिस्थिति में ऐसा नहीं करना चाहेंगे, लेकिन अगर आगे बढ़ने से पहले किसी मूल्य की आवश्यकता है, तो यह ऐसा करेगा।

Question 7

यह काफी पुराना है, और बदसूरत है, ऐसा मत करो। आपको कॉलबैक का उपयोग करना चाहिए: https://stackoverflow.com/a/5316755/591257
एक ही समस्या थी, एक वैश्विक संस्करण का उपयोग करके इसे इस तरह हल किया। यकीन नहीं है कि यह सबसे अच्छा है, लेकिन निश्चित रूप से काम करता है। त्रुटि होने पर आपको एक रिक्त स्ट्रिंग (myVar = '') मिलती है, ताकि आप आवश्यकतानुसार इसे संभाल सकें।

var myVar = '';
function isSession(selector) {
  $.ajax({
    'type': 'POST',
    'url': '/order.html',
    'data': {
      'issession': 1,
      'selector': selector
    },
    'dataType': 'html',
    'success': function(data) {
      myVar = data;
    },
    'error': function() {
      alert('Error occured');
    }
  });
  return myVar;
}

Question 8

// Common ajax caller
function AjaxCall(url,successfunction){
  var targetUrl=url;
  $.ajax({
    'url': targetUrl,
    'type': 'GET',
    'dataType': 'json',
    'success': successfunction,
    'error': function() {
      alert("error");
    }
  });
}

// Calling Ajax
$(document).ready(function() {
  AjaxCall("productData.txt",ajaxSuccessFunction);
});

// Function details of success function
function ajaxSuccessFunction(d){
  alert(d.Pioneer.Product[0].category);
}

यह मदद कर सकता है, एक आम अजाक्स कॉल फंक्शन बना सकता है और एक फंक्शन संलग्न कर सकता है जो अजाक्स कॉल की सफलता के समय आह्वान करता है, उदाहरण देखें

Question 9

यहां से मदद के साथ

function get_result(some_value) {
   var ret_val = {};
   $.ajax({
       url: '/some/url/to/fetch/from',
       type: 'GET',
       data: {'some_key': some_value},
       async: false,
       dataType: 'json'
   }).done(function (response) {
       ret_val = response;
   }).fail(function (jqXHR, textStatus, errorThrown) {
           ret_val = null;
       });
   return ret_val;
}

उम्मीद है कि यह किसी को थोड़ा सा मदद करता है।

Question 10

हाय कोशिश async: अपने अजाक्स कॉल में झूठी ..