Question

I ve a problem with the output:i want to fill the ouptput whit some data from an ajaxcall.
the call is successfull(the output inside the each is filled with data)
but the output inside the each issnt apended to the output outside .
i always geht “

<ul id="listname" data-inset=true></ul>

and not

  <ul id="listname" data-inset=true><li>some data</li></ul>

 

$("div:jqmData(role='collapsible')").each(function(){
var id = $(this).data("id");
     var idDate=id.slice(7,18);
     var listapp="id_col_"+idDate;
      var listname="id_col_"+idDate;
                   output='<ul id="listname" data-inset=true>';

                             $.ajax({
                             url: 'lomodata.php',
                             data: 'timestamp='+idDate,
                             type: 'GET',
                             ContentType: "application/json",
                             dataType: "json",
                             success:function(res) {
                             if(res !='')
                            {
                            $.each(res, function(i, Object) {
                             output+='<li>'+Object.reg+'</li>';
                              console.log(output);
                            }); 
                             }
                             }

                             });

                    output+='</ul>';

                    $(this).append(output).trigger("create");
                    $(this).listview();
                    $(this).listview('refresh');
});

Answer 1

AJAX is Asynchronous. When you write $.ajax( ... ), an HTTP request will be sent to the server, which will then move on to the next operation, output += '</ul>'. The HTTP request will not have finished by this time, and so your callback will not yet have been executed by the time you append output to the document.