Note that there are some explanatory texts on larger screens.

plurals
  1. POAjax call, see elements visualy but Javascript doesn't see them
    text
    copied!<p>I would really appreciate your help, as I been looking over and over and completely lost in what could go wrong.</p> <p>I have an Ajax call to web service, and from this call I am building some HTML structure. Up to this point everything is good, the data get pulled and I can visually see the structure.</p> <p>However as my code continues and I try to read those elements later for some more manipulations, JavaScript doesn't see them at all, and on element counts I am getting zero.</p> <p>Some relevant code from the project. This function that runs first and basically builds the needed HTML piece</p> <pre><code> $.ajax({ type: "POST", url: "HistoryEventsWebService.asmx/getEventsData", data: event_types, contentType: "application/json; charset=utf-8", dataType: "json", success: function (result) { //on success var results = result.d; $('#insidediv_container').empty(); for (var i = 0; i &lt; results.length; i++) { var insidediv = ''; insidediv += '&lt;div class="insidediv"&gt;'; insidediv += '&lt;span class="month"&gt;' + results[i].month + '&lt;/span&gt;&lt;span class="day"&gt;' + results[i].day + '&lt;/span&gt;&lt;span class="year"&gt;' + results[i].year + '&lt;/span&gt;'; insidediv += '&lt;div class="header"&gt;&lt;span&gt;Jan 08, 2010 - event one&lt;/span&gt; &lt;/div&gt;'; insidediv += '&lt;div class="contentdiv"&gt;' + results[i].event_desc + '&lt;/div&gt;'; insidediv += '&lt;/div&gt;'; $('#insidediv_container').append(insidediv); } } }); return false; </code></pre> <p>Right after this upper function is done, my code is continued to next function, and that's where I have my problem!</p> <pre><code> var currentbox = 0; var current_box_old = 0; var box_size = ($('.insidediv').width() + 1).toString(); var box_count = $('.container2 &gt; div &gt; div').length - 1; //console.log(box_count); var min_range = 0; setScale(); //making slider visual elements //slider code $("#slider").slider({ min: min_range, max: box_count, value: 0, animate: true, //step: 1, slide: function (event, ui) { current_box_old = currentbox; currentbox = ui.value; if (currentbox &gt; current_box_old) $('#insidediv_container').animate({ "margin-left": "-=" + box_size + "px" }, "normal"); else $('#insidediv_container').animate({ "margin-left": "+=" + box_size + "px" }, "normal"); } }); </code></pre> <p>Thank you in advance.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload