установить глобальную переменную в ajax получить успех

Question

Я хочу установить переменную next_load во время успеха вызова ajax. Я читал, что это невозможно, потому что вызов aysnc и что я могу настроить вызов на синхронизацию, но это замедлит работу. Я попробовал метод ниже, но все же не могу установить переменную. Можете ли вы указать, где я ошибся?

var next_load = ""; 

function getData() { 
    $.ajax({ 
     url : 'student/calendar/show/2016/02', 
     type: 'GET', 
     success : function(response){ 
      var $result = $(response).filter('li'); 
      $('.box-content').append($result); 

      next_load = $result.last().attr('data-date'); 
     } 
    }) 
} 

getData(); 

console.log(next_load); 

Или еще лучше по DelightedD0D

Это пятно на то, что я хочу сделать. Я хочу, чтобы передать следующую переменную next_load в другую функцию и повторно использовать ее в функции getdata. Теперь проблема im заключается в том, что я получаю несколько next_load, когда начинается цикл. Вот что я сделал с кодом:

HTML:

<div id = "calendar"> 
       <div class = "box"> 
        <ul class = "label"> 
         <li>Sun</li> 
         <li>Mon</li> 
         <li>Tue</li> 
         <li>Wed</li> 
         <li>Thur</li> 
         <li>Fri</li> 
         <li>Sat</li> 
        </ul> 
       </div> 
       <ul class = "box-content"> 

       </ul> 
    </div> 

The Jquery:

function getData(url) { 
    var next_load = ''; 
    $.ajax({ 
     url: 'student/calendar/' + url, 
     type: 'GET', 
     success: function(response) { 
      var $result = $(response).filter('li'); 
      $('.box-content').append($result); 

      next_load = $result.last().attr('data-date'); 
      useNextLoad(next_load); // dont use the value till the ajax promise resolves here 

     } 
    }) 
} 
getData('show/2016/02'); 

function useNextLoad(next_load){ 
    var load = next_load; 
    $('.box').click(function(){ 
     getData('load/' + load); 
     console.log(load); // when i pass the next_load Im getting the previous next load and the new next load at the same time. Then on the next click the amount compounds. 
    }); 

} 

в консоли:

2 calendar.js:34 2016-03-05 
calendar.js:34 2016-04-09 

Если я сбрасываю переменную next_load, это будет препятствовать ее созданию? Я попытался очистить переменную перед вызовом ajax, но я все равно получаю ее.

Answer 1

Вы можете установить значение, которое вы просто не можете использовать, пока функция async не вернется. Вы должны будете использовать функцию обратного вызова успеха, чтобы знать, когда Аякс обещание разрешить и использовать значение, как это:

var next_load = ""; 

function getData() { 
    $.ajax({ 
    url: 'student/calendar/show/2016/02', 
    type: 'GET', 
    success: function(response) { 
     var $result = $(response).filter('li'); 
     $('.box-content').append($result); 

     next_load = $result.last().attr('data-date'); 
     useNextLoad(); // dont use the value till the ajax promise resolves here 

     console.log(next_load); // or just use it here directly 

    } 
    }) 
} 
getData(); 

function useNextLoad(){ 
    console.log(next_load); 
} 

---

Или еще лучше, потерять глобальную вообще и просто передать ответ к функции из обратного вызова успеха.

function getData() { 
    $.ajax({ 
    url: 'student/calendar/show/2016/02', 
    type: 'GET', 
    success: function(response) { 
     var $result = $(response).filter('li'); 
     $('.box-content').append($result); 

     var next_load = $result.last().attr('data-date'); 
     useNextLoad(next_load); // dont use the value till the ajax promise resolves here 

    } 
    }) 
} 
getData(); 

function useNextLoad(next_load){ 
    console.log(next_load); 
} 

Лучше быть лучше бы передать функцию обратного вызова функции getData для обработки ответа, как:

function getData(callback) { 
    $.ajax({ 
    url: 'student/calendar/show/2016/02', 
    type: 'GET', 
    success: callback 
    }) 
} 
getData(function(response) { 
    var $result = $(response).filter('li'); 
    $('.box-content').append($result); 
    var next_load = $result.last().attr('data-date'); 
    console.log(next_load); 
});