2016-11-29 4 views
0

Это часть кода javascript, который работает хорошо. Но я хочу, чтобы отобразить различные опции в // Ex2 линии:javascript - Какая ошибка с этим кодом?

if(profId==10){ 
    //alert(profId); 
    $("#div_sel_residentType").show("slow"); 

    var selectElm="<label for=\"sel_residentType\">Sélectionniez le Type du Résident:</label><select class=\"form-control\" id=\"sel_residentType\"><option value=\"0\" selected=\"\">Type Résident</option>"; 
    var options =""; 
    $.get("../api/v1/get/menus/typeresident.json.php", function(dataset, status){ 
     for (var index in dataset){ 
      options = options + "<option value=\""+dataset[index].id+"\">"+dataset[index].description+"</option>"; 
      //console.log(options); 
     } 
     console.log(options);//Ex1 
    }); 

    console.log(options);//Ex2 
    selectElm = selectElm + options + "</select>"; 
    //console.log(selectElm); 
    //$("#div_sel_residentType").html(selectElm); 
} 

Я хотел бы понять, почему он отображает console.log(options);//Ex1 но не console.log(options);//Ex2

+3

'Ex2' выполняется сразу после вызова' $ .get'. 'Ex1' выполняется после того, как вызов получил ответ. –

+0

'$ .get' является асинхронным, что означает, что функция, которую вы передадите ей, будет вызываться, когда ответ будет доступен. Тем временем ваш код уже будет запущен, чтобы перейти в // Ex2, где параметры по-прежнему «». – connexo

ответ

1

Этот вызов ajax равен async, что означает, что в данный момент значение не существует на Ex2. Решение для этого состоит в использовании взглянуть deferred объект, расположенные на этой странице: DOC

Пример из ссылки:

Поскольку метод jQuery.get возвращает объект jqXHR, который является производным от отсроченного объекта, мы можем связать успешный обратный вызов с использованием метода .done().

Полный пример из вас код:

var options = ""; 
var defObj = $.get("../api/v1/get/menus/typeresident.json.php", function(dataset, status) { 
     for (var index in dataset) { 
     options = options + "<option value=\"" + dataset[index].id + "\">" + dataset[index].description + "</option>"; 
     //console.log(options); 
     } 
     console.log(options); //Ex1 
    }); 

// get something done after ajax respone 
defObj.done(function() { 
    console.log(options); //Ex2 
    selectElm = selectElm + options + "</select>"; 
}); 

или вы можете сделать это в одной строке:

$.get(/*...*/).done(/*...*/); 
1

$.get(...) инициирует асинхронный вызов. Поэтому выполнение будет продолжено с помощью следующего оператора, и только позже (после завершения запроса GET) будет выполнен обратный вызов.

Таким образом, линия console.log(options);//Ex2доoptions заполняется. Так что это эквивалентно console.log("").

+0

да .. это правда .. как сделать обратный вызов после $ get()? – zwitterion

+0

Ок, не волнуйтесь ... Я просто положил .done() и решил. благодаря – zwitterion

0
console.log(options); //Ex2 

Это фактически выполняет первый. И посмотрите, как переменная options определяется:

var options = ""; 

Так что если вы ищете что-то печатать на консоли, это просто пустое пространство, поэтому ничего не будет отображаться.

Смежные вопросы