title: Javascript: How to loop through elements and call onblur handler for certain elements
body: <p>I have a case where I have a bunch of text boxes and radio buttons on a screen all built dynamically with various DIVs.  There are onblur routines for all of the text boxes to validate entry, but depending on the radio button selection, the text box entry could be invalid when it was valid originally.  I can't use onblur with the radio buttons because they could go from the radio button into one of the text boxes that was made invalid and create an infinite loop since I'm putting focus into the invalid element.  Since each text box has its own special parameters for the onblur calls, I figure the best way to do this is to call the onblur event for the textboxes when the form gets submitted to make sure all entry is still valid with the radio button configuration they have selected.  I also need it to stop submitting if one of the onblur events returns false so they can correct the textbox that is wrong.  This is what I've written...</p>
  
  <pre><code>    for (var intElement = 0; intElement &lt; document.forms[0].elements.length; intElement = intElement + 1)
      {
          if (document.forms[0].elements[intElement].name.substr(3) == "FactorAmount") // The first 3 characters of the name are a unique identifier for each field
          {
              if (document.forms[0].elements[intElement].onblur())
              {
                  return false;
                  break;
              }
          }
      }
  
  return true;
  </code></pre>
  
  <p>I originally had (!document.forms[0].elements[intElement].onblur()) but the alert messages from the onblur events weren't popping up when I had that.  Now the alert messages are popping up, but it's still continuing to loop through elements if it hits an error. I've stepped through this with a debugger both ways, and it appears to be looping just fine, but it's either 1) not stopping and returning false when I need it to or 2) not executing my alert messages to tell the user what the error was.  Can someone possibly help?  It's probably something stupid I'm doing.</p>
  
  <p>The onblur method that is getting called looks like this...</p>
  
  <pre><code>function f_VerifyRange(tagFactor, reaMin, reaMax, intPrecision, sLOB, sIL, sFactorCode)
  {
      var tagCreditOrDebit;
      var tagIsTotal;
      var tagPercentageOrDecimal;
  
      eval("tagCreditOrDebit = document.forms[0]." + tagFactor.name.substr(0,3) + "CreditOrDebitC");
  
      eval("tagIsTotal = document.forms[0]." + tagFactor.name.substr(0,3) + "IsTotal");
      eval("tagPercentageOrDecimal = document.forms[0]." + tagFactor.name.substr(0,3) + "PercentageOrDecimal");
  
      if (tagPercentageOrDecimal.value == "P")
      {
          reaMax = Math.round((reaMax - 1) * 100);
          reaMin = Math.round((1 - reaMin) * 100);
  
          if (parseFloat(tagFactor.value) == 0)
          {
              alert("Please enter a value other than 0 or leave this field blank.");
  
              f_SetFocus(tagFactor);
              return false;
          }
  
          if (tagIsTotal.value == "True")
          {
              if (tagCreditOrDebit.checked)
              {
                  if (parseFloat(tagFactor.value) &gt; reaMin)
                  {
                      alert("Please enter a value less than or equal to " + reaMin + "% for a credit or " + reaMax + "% for a debit.");
                      f_SetFocus(tagFactor);
                      return false;
                  }
              }
              else
              {
                  if (parseFloat(tagFactor.value) &gt; reaMax)
                  {
                      alert("Please enter a value less than or equal to " + reaMin + "% for a credit or " + reaMax + "% for a debit.");
                      f_SetFocus(tagFactor);
                      return false;
                  }
              }
          }
      }
  
      return true;
  }
  </code></pre>
  
  <p><strong>EDIT:</strong> I think I've figured out why this isn't working as expected, but I still don't know how I can accomplish what I need to.  The line below...</p>
  
  <pre><code>            if (!document.forms[0].elements[intElement].onblur())
  </code></pre>
  
  <p>or</p>
  
  <pre><code>            if (document.forms[0].elements[intElement].onblur())
  </code></pre>
  
  <p>is not returning what the single onblur function (f_VerifyRange) is returning.  Instead it is always returning either true or false no matter what.  In the first case, it returns true and then quits and aborts the submit after the first textbox even though there was no error with the first textbox.  In the second case, it returns false and runs through all the boxes.  Even though there might have been errors (which it displays), it doesn't think there are any errors, so it continues on with the submit.  I guess what I really need is how to get the return value from f_VerifyRange which is my onblur function.</p>