title: Use one JavaScript function with two forms
body: <p>I have a JavaScript function for checking form input which sends an AJAX request to a PHP script. Here is the HTML:</p>
  
  <pre><code>&lt;form method="post" id="textform35" action="insert_text.php"&gt;
      &lt;textarea id="text" cols="80" rows="3" placeholder="forecast text"&gt;&lt;/textarea&gt;
      &lt;input type=hidden id="text_old" value=""&gt;
      &lt;input type=hidden id="sin_type" value="short"&gt;
      &lt;input type=hidden id="den" value="0"&gt;
      &lt;input type=hidden id="grad" value="България-в"&gt;
      &lt;input type=hidden id="span" value="1"&gt;
      &lt;input type="button" name="Submit" value="Submit" onclick="validate_sendForm()"&gt;
  &lt;/form&gt;
  
  &lt;form method="post" id="textform70" action="insert_text.php"&gt;
      &lt;textarea id="text" cols="80" rows="12" placeholder=" &gt;&gt; "&gt;&lt;/textarea&gt;
      &lt;input type=hidden id="text_old" value=""&gt;
      &lt;input type=hidden id="sin_type" value="short"&gt;
      &lt;input type=hidden id="den" value="0"&gt;
      &lt;input type=hidden id="grad" value="България-в"&gt;
      &lt;input type=hidden id="span" value="1"&gt;
      &lt;input type="button" name="Submit" value="Запази" onclick="validate_sendForm()"&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>As you can see, there are two forms with identical elements but with different <code>id</code>s.</p>
  
  <p>The function <code>validate_sendForm()</code> is as below:</p>
  
  <pre><code>function validate_sendForm() {
      var text=document.getElementById("text").value;
      var y=document.getElementById("text_old").value;
  
      if (text==y) {
          if (y=='') {
              alert("some text ");
              return false;
          } else {
              alert("another text ");
              return false;
          }
      } else {
          var city_id   = document.getElementById("grad").value;
          var fore_code = document.getElementById("sin_type").value;
          var date_for  = document.getElementById("den").value;
          var date_span = document.getElementById("span").value;
  
          var xhttp = new XMLHttpRequest();
          var params="grad="+city_id+"&amp;den="+date_for+"&amp;span="+date_span+"&amp;sin_file="+fore_code+"&amp;tekst="+text;
          xhttp.open("POST", "insert_text.php", true);
          xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
          xhttp.setRequestHeader("Content-length", params.length);
          xhttp.setRequestHeader("Connection", "close");
  
          xhttp.onreadystatechange = function() {
              if (xhttp.readyState == 4 &amp;&amp; xhttp.status == 200) {
                  alert(xhttp.responseText);
              }
          }
  
          xhttp.send(params);
      }
  };
  </code></pre>
  
  <p>How can I use the function with both forms? Now it takes the values of the first form and never looks at the second one. I suppose I have to use "this" but have no idea where or how. Please, don't suggest that I use jQuery because I can not.</p>