I have a JS function that makes an AJAX call several times, based on how many checkboxes are checked on the page. On each iteration, I check the value of a hidden field with document.getElementById().value; if it's false, the function is supposed to break.

The value of the hidden field is set by clicking a button elsewhere on the page, it's initially set to true.

My problem is: if I call that function, and change the value of the hidden field to "false" with the button while the function is looping, the function still sees the hidden field as "true". The function does not see the new value during its execution. If I call the function a second time after this, it sees the appropriate field value as "false"

I made a second button that brings up an alert() with the value of the hidden field, and this is always correct.

I've tried using a global variable instead of a hidden field, the same problem occurs. The same thing happens in both IE and Firefox.

Why doesn't the function see the updated value of the hidden field? Any help would be appreciated, thanks!

Recommended Answers

All 3 Replies

I had similar problems.

You have to remember that nothing is "global" across multiple computers.

There are several things to check out:

Where and when does the evaluation of your getElementById() call actually take place?

Are you passing the actual value of the hidden field, or a pointer to the field, as a parameter?

Does the updating of fields wait until the function pauses (say, for an alert)? Try putting in an alert just BEFORE you read the field. If it changes the results, this is it.

Is the AJAX call working on a copy of the form, instead of the original? If so, when do the two copies become resolved?

Are you actually getting the correct result, but not returning it? Some kinds of parameter passing do not return the value through the parameter, but leave the old value in place in the calling program. This is what I had to learn earlier this year.

Code goes something like this:

function update(number) {
 for(var x = 0; x < number; x++) 
 {
  if document.getElementById('hiddenfield').value == 'true'
   ajaxcall
  }
 }
}

The problem is, "document.getElementById('hiddenfield').value" returns 'true' every time it's called within this function, even though I have already changed the field value to 'false' on the page. Putting an alert within the function also returns the outdated value.

If I execute code outside of the function while this function is running, like the alert() button I mentioned earlier, it shows the correct value of hiddenfield.

1. I click a button that runs update()

2. Before update() finishes all the iterations in the for loop, I change 'hiddenfield' to false by pressing another button.

3. Subsequent document.getElementById('hiddenfield').value calls within update() still return 'true', even though the value of 'hiddenfield' is now 'false'.

document.getElementById('hiddenfield').value executed outside of update() returns the correct value, 'false'

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.