title: javascript - validation focus on error, AND referring to THIS element
body: <p>sorry for the hyper basic question,</p>
  
  <p>I'm doing a validation onChange - it behaves as expected to a point - and it just allows you to continue...</p>
  
  <p>here's my 'simple' requirements...
  a field has a RANGE of values it will accept. (i.e. 0-3, 1-5, 1-10...)
  I'm calling a function onChange, when some value other than one within the range is entered...
  I want an alert, and the focus to remain in that field (maybe even clear the erroneous value)</p>
  
  <p>The code I have - works to the point it sends an alert - 
  HOWEVER once you click 'ok' to the alert - the focus has moved to the next element, and the 'bad' data IS STILL in the field...</p>
  
  <p>I KNOW there's a way to refer to the element that is 'calling' the function, but I don't know the syntax, but it should be easy to focus and clear the element??? right???</p>
  
  <p>the code:</p>
  
  <pre><code>&lt;form name="FRM_SCORING" id="FRM_SCORING" action=""  &gt;
  &lt;input type="text" name="AOS1" onchange="checkrange(this.value,0,1);"&gt;
  &lt;input type="text" name="AOS2" onchange="checkrange(this.value,0,3);"&gt;
  &lt;/form&gt;
  
  &lt;script&gt;
  function checkrange(object_value, min_value, max_value) {
  //---  remove leading and trailing spaces 
  var trimmed_object_value = trim(object_value);
  var temp_object_value    = trimmed_object_value;
  
  alert ("You've entered a value that is not allowed. \nCheck the range of numbers allowed for this 'answer'.");
  
  //---  if less than minimum or greater than maximum, return false  ---//
  if ( isNaN(trimmed_object_value) || 
           (trimmed_object_value &lt; min_value) || (trimmed_object_value &gt; max_value)
         ) {
         alert ("You've entered a value that is not allowed.");
      return false;
  } 
  }
  &lt;/script&gt;
  </code></pre>