Strange bug. Javascript, , Trying to run a loop, but getting a blank error in Chrome console

82
March 13, 2018, at 5:29 PM

I'm running a loop on an array received from an obj {message:Array(22)} ajax call. You can see the array has length = 22. The first time through the loop, I console.log the lengths of the array, and my iterator.

console.log('got a message');
    var messages = resp_obj.message;
    console.log(messages);
    for(let x = 0 ; x < messages.length ; X++){
      console.log(messages.length);
      console.log(x);
      console.log(messages[x]);
    }

You can see the loop stops with a blank error. Ive been stuck on this for a while. the code prior to this is also giving me unpredictable results.

to make the ajax call, im listening to 3 select elements for onchange events, and waiting for all three to be set

<select>{...}</select>    
<select>{...}</select>    
<select>{...}</select>
//add event listener onchange
$.each($('select'), (i, v)=>{
$(v).addClass('not-set')
$(v).on('change', (e)=>{
  var tar = e.target
  var val = e.target.value
  var _found_data
  if(val==''){
    $(tar).addClass('not-set')
    $(tar).removeClass('is-set')
  }else{
    $(tar).removeClass('not-set')
    $(tar).addClass('is-set')
  }
  //each change event will also run this to check if all three are also set
  check_the_other_selects();
})
function check_the_other_selects(){
  var data_obj = {}
  $.each(select_items, (i, v)=>{
    var key = $(v).attr("name")
    var val = $(v).val()
    if(val=='') return
      data_obj[key]=val
    if(Object.keys(data_obj).length == 3){
      console.log('we got a full obj');
      console.log(data_obj);
      $.post('/output', data_obj, (resp)=>{
        console.log(resp);
        //run the loop function with this returned data that is causing the bug in the image posted about
      })
    }else{
      console.log('not full yet');
    }
  }) 
}

The most inconsistent part is what happens with the onchange events, and i've tried listening for input events also with similar results. The handler for the onchange event will stop before running the check_the_others function, until i click another select, then it finished the first call to check_the_others. The best outcome I have so far is this blank error, but im still stumped, any ideas? Thank you.

Answer 1

you have a capital X on this line causing an error and stopping the loop

for(let x = 0 ; x < messages.length ; x++)
READ ALSO
jquery Nestable is not scrolling while list is long

jquery Nestable is not scrolling while list is long

I'm using Nestablejs for drag/drop I'm displaying that list (on which drag/drop required) in a modal(bootstrap modal), Everything is working fine for me, the issue is when list (within

83
How to set input data-toggle for a link in bootstrap?

How to set input data-toggle for a link in bootstrap?

I have a link and I want to set a bootstrap toggle for it :

94
Does a zero width character that is skipped by the caret while moving it with keyboard arrows exist? (ie11, contenteditable)

Does a zero width character that is skipped by the caret while moving it with keyboard arrows exist? (ie11, contenteditable)

I have a div with several span tags insideIn each span tag I put zero-width character:

54
Why on click on element returns undefined in jquery? [duplicate]

Why on click on element returns undefined in jquery? [duplicate]

This question already has an answer here:

51