title: populating a dynamic form with javascript
body: <p>I am trying to get a forloop with input elements to run between a form and create a form dynamically with javascript </p>
  
  <p>1: in scenario one , the form in the script is getting closed before the input elements populate.</p>
  
  <p>2: in scenario two , when i put the for loop variable between the form ,the error that comes is undefined .</p>
  
  <p>PLEASE HELP</p>
  
  <p><h1> SCENARIO ONE </H1></p>
  
  <pre><code>&lt;form&gt;
  No of Feilds &lt;input type="text" id= "numberoffeilds"&gt;
  &lt;input type="button" value = "Create Feilds" onclick= "addfeilds1();"&gt; 
  &lt;/form&gt;
  
  &lt;div id= "div4" style= "color:gray"&gt;&lt;/div&gt; 
  
  
  &lt;script&gt;
  
  function addfeilds1()
  {
     var totalfeilds = document.getElementById("numberoffeilds").value;
     var i;
  
     document.getElementById("div4").innerHTML += '&lt;form action= "issue.html" method = "POST"&gt;';
  
     for(i=0;i&lt;totalfeilds;i++)
     {
         document.getElementById("div4").innerHTML += '&lt;input type = "text"&gt;';
     }
  
     document.getElementById("div4").innerHTML += '&lt;input type = "submit" value="submit" name="submit"&gt;';
  
  }
  &lt;/script&gt;
  </code></pre>
  
  <p><H1> SCENARIO TWO </H1></p>
  
  <pre><code>&lt;form&gt;
  No of Feilds &lt;input type="text" id= "numberoffeilds"&gt;
  &lt;input type="button" value = "Create Feilds" onclick= "addfeilds2();"&gt; 
  &lt;/form&gt;
  
  &lt;div id= "div4" style= "color:gray"&gt;&lt;/div&gt; 
  
  &lt;script&gt;
     function addfeilds2()
     {
        var totalfeilds = document.getElementById("numberoffeilds").value;
        var i;
  
        function forloop()
        {
            for(i=1 ;i&lt;totalfeilds;i++)
            {
                 document.getElementById("div4").innerHTML += '&lt;input type = "text"&gt;';
            }
        }
  
        var loopvar = forloop();
  
        document.getElementById("div4").innerHTML += '&lt;form action= "issue.html" method = "POST"&gt;'+
        '&lt;input type = "text"&gt;'+
        loopvar + // it shows the loop as undefined
       '&lt;input type = "text"&gt;'+
       '&lt;input type = "text"&gt;'+
       '&lt;input type = "submit" value="submit" name="submit"&gt;';
  
     }
  &lt;/script&gt;
  </code></pre>