jQuery load function inside jQuery load function

Question

So I'm trying to parse a large amount of data from another website trough JavaScript and jQuery and (I'm new to both) so the problem here is the function inside the 2nd jQuery load() is not working.

function load() {

 var r = 0;
 var cols = [4,5,8,9,10];
 $('#Parser').load('url #tableID', function () {
   var r = $('#Parser').find('label').length;

   for (var i = 0; i < r; i++) {
     $('#table').append('<tr id="'+i+'"></tr>')

     for (var j = 0; j < cols.length; j++) {
       $('#'+i).append('<td id="c'+i+j+'"></td>')
       $('#c'+i+j).load('url #tableId\\:Row'+i+'\\:Col'+cols[j], function() {
         $('#c'+i+j).html($('#c'+i+j).children().text());
       });
     }
   }
   $('#Parser').html('');
 });
}

So if tested this on its own with static id's and it works

$('#test').load('url #tableId\\:Row1\\:Col1', function() {
   $('#test').html($('#test').children().text());
});

I need to parse the code by column and row like this because the webpage where I'm getting the data from has the data I want scattered over the columns on the cols variable and I find how many rows the table has on the r variable

I don't know if it's a logic problem or just a misuse of the functions but I have been struggling the whole day and I needed help.

The main load() function is called when the page starts, and this outputs the whole element instead of only the text

var time =new Date().getTime();
var rc = 0;
load();
refresh();

function load() {
var r = 0;
var cols = [4,5,8,9,10];

$('#Parser').load('url #tableID', function () {
  var r = $('#Parser').find('label').length;
  if (r != 0) {
    //Simulating going back to this page
    $('body').css({'background-color':'red','color':'white'});
    for (var i = 0; i < r; i++) {
      if (rc < r) {
        $('#table').append('<tr id="'+i+'"></tr>')
      }
      for (var j = 0; j < cols.length; j++) {
        if (rc < r) {
          $('#'+i).append('<td id="c'+i+j+'"></td>')
        }
        col =  $('#c'+i+j).load('url #tableId\\:Row'+i+'\\:Col'+cols[j],function() {
          if ($('#c'+i+j).html != col){
            $('#c'+i+j).html('');
          }
        });

      }
    }
  }else {
    if (rc != 0 ) {
      for (var i = 0; i < rc; i++) {
        for (var j = 0; j < cols.length ; j++) {
          $('#c'+i+j).html('');
        }
      }
    }
    if ($('body').css('background-color') != 'white') {
      //Simulating another page
      $('body').css({'background-color':'white','color':'black'});
    }
  }
  $('#Parser').html('');
  if (rc < r) {
    rc = r ;
  }
});
}
function refresh() {
 if(new Date().getTime() - time >= 10000){
  load();
  setTimeout(refresh, 10000);
}else{
  setTimeout(refresh, 10000);
}
}

This is my full javascript on the page the previous code is my atempt on processing it to text on a simpler way

What do you mean by that?, i can guess you are asking what its for , it gets the table so i can count its rows, which is pretty stupid but i only know it this way. The load() function is called when the page opens — Daniel Pereira
– Daniel Pereira, Commented May 9, 2018 at 15:33
I'm asking because maybe when the load() function gets called, the DOM might not have been rendered yet, which would explain your $('el') not finding any elements at all. — James
– James, Commented May 9, 2018 at 15:38
But I tought that the code inside the $().load(function) on both loads is only executed after it finishes — Daniel Pereira
– Daniel Pereira, Commented May 9, 2018 at 15:39
I don't know how your HTML is being rendered, (you should include your HTML as code description), if the same function works outside the main load() then it has to be either that, your HTML not rendering on time or your select is not correct. — James
– James, Commented May 9, 2018 at 15:42

James · Accepted Answer · 2018-05-09 15:44:09Z

1

Try this:

function load()
{
    ...your code...
}

$(document).ready(load);

Maybe the function is not being called on time, make sure you call it AFTER the DOM has been rendered.

answered May 9, 2018 at 15:44

James

7091 gold badge8 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Micah Githens Over a year ago

Or you could wrap your load() function code inside equivalent .ready() method like so $(function(){ //main load function code goes here... var l = 0; var cols = [4,5,8,9,10]; ... });

Daniel Pereira · Accepted Answer · 2018-05-10 16:31:03Z

0

Okay so it was a pretty easy fix, inside the second load function I have replaced the

$('#c'+i+j).html($('#c'+i+j).children().text());

to

$(this).html($(this).text());

And it works fine now.

answered May 10, 2018 at 16:31

Daniel Pereira

117 bronze badges

Collectives™ on Stack Overflow

jQuery load function inside jQuery load function

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related