title: Update partially dynamic form with AJAX (No Refresh)- can't get this to work
body: <p>I need to have this form post to the database and retrieve the newly added information without refreshing using XHR. </p>
  
  <p>The page loads with a few initial elements that can be edited and can have more 'new' ones added dynamically by pushing a button (new users will need to do this, as they have no pre existing tasks. It tracks who you are with session_id).</p>
  
  <p>I've been at this for over 13 hours now, kinda tired. </p>
  
  <p>Code:</p>
  
  <p><strong>Index.php</strong></p>
  
  <pre><code>&lt;?php 
      //Sets unique session for the current visitor and keeps track of information for use with database
      $time = time();  
      $date = $today = date("Ymd");  
      $id = $time + $date;  
  
      $id = session_id();
      if(empty($id)) session_start();
  
      //echo "SID: ".SID."&lt;br&gt;session_id(): ".session_id()."&lt;br&gt;COOKIE: ".$_COOKIE["PHPSESSID"];
  
  
  ?&gt;
  &lt;!doctype html&gt;
  &lt;html&gt;
      &lt;head&gt;
      &lt;meta charset='utf-8'&gt; 
      &lt;title&gt;Simple To-Do List&lt;/title&gt;
      &lt;?php
          // Create connection via my connect.php file
          require 'connect.php';
  
              // Create query
              $query= "select * from checklist where SID = '".session_id()."'"; 
              $result = mysql_query($query);
  
              // Create requisite array for checklist
              $checklistItems = array();
  
             //Check to ensure query won't implode and is valid
             if($result === FALSE) {
               die(mysql_error()); 
              }
  
               // Calculates number of rows from query  
              $num=mysql_numrows($result);
  
              mysql_close($con);
  
      ?&gt;
          &lt;!-- javascript code to dynamically add new form fields as well as check\uncheck all boxes --&gt;
              &lt;script src="//code.jquery.com/jquery-latest.min.js" language="javascript" type="text/javascript"&gt;&lt;/script&gt;  
              &lt;script src="addInput.js" language="Javascript" type="text/javascript"&gt;&lt;/script&gt;
  
  
  
      &lt;/head&gt;
      &lt;body&gt;   
  
          &lt;h1&gt;My To-Dos&lt;/h1&gt;
  
  
       &lt;form name="checklist" id="checklist" class="checklist"&gt;
          &lt;?php // Loop through query results   
                while($row = mysql_fetch_array($result))
                    {
                    $entry = $row['Entry'];
                    $CID = $row['CID'];
                    $checked =$row['Checked'];
                   // echo $CID;
                    echo "&lt;input type=\"text\" value=\"$entry\" name=\"textfield$CID;\" id=\"textfield$CID;\" onchange=\"showUser(this.value)\" /&gt;";
                    echo "&lt;input type=\"checkbox\" name=\"checkbox$CID;\" id=\"checkbox$CID;\"  value=\"$checked\"".(($checked == '1')? ' checked="checked"' : '')."  /&gt;";
                    echo "&lt;br&gt;";
                    }
          ?&gt; 
          &lt;div id="dynamicInput"&gt;&lt;/div&gt;
          &lt;input type="submit" id="checklistSubmit" name="checklistSubmit" class="checklist-submit"&gt; &lt;input type="button" id="CompleteAll" name="CompleteAll" value="Check All" onclick="javascript:checkAll('checklist', true);"&gt;&lt;input type="button" id="UncheckAll" name="UncheckAll" value="Uncheck All" onclick="javascript:checkAll('checklist', false);"&gt;                  
       &lt;input type="button" value="Add another text input" onClick="addInput('dynamicInput');"&gt;&lt;/form&gt;
  
  
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p><strong>connect.php</strong></p>
  
  <pre><code>&lt;?php 
  
  // Create connection
  $con=mysql_connect("localhost","root","");
  $selected = mysql_select_db("madmonk",$con); 
  
  // Check connection
  if (mysqli_connect_errno($con))
  {
      echo "Failed to connect to MySQL: " . mysql_connect_error();
  }
  
  ?&gt;
  </code></pre>
  
  <p><strong>addInput.js</strong></p>
  
  <pre><code>// Creates new dynamic elements within HTML body
  var counter = 0;
  var limit = 8;
  
  function addInput(divName){ 
       i=counter; i++;
       if (counter == limit)  {
            alert("You have reached the limit of adding " + counter + " inputs");
       }
       else {
  
            var newdiv = document.createElement('div');
            newdiv.innerHTML = " &lt;input type='text'name='myInputs["+i+"]'&gt;&lt;input type='checkbox' name='myInputs["+i+"]'&gt;&lt;br&gt;";
            document.getElementById(divName).appendChild(newdiv);
            counter++;
       }
  }
  
  //Checks\unchecks all checkboxes on the web page
  function checkAll(formname, checktoggle)
      {
          var checkboxes = new Array(); 
          checkboxes = document[formname].getElementsByTagName('input');
          for (var i=0; i&lt;checkboxes.length; i++)  {
          if (checkboxes[i].type == 'checkbox')   {
          checkboxes[i].checked = checktoggle;
            }
         }
      }
  
  
  //AJAX code to communicate with server without page refresh
  $('checklistSubmit').click(function(e) {
      $(e).stopPropagation();
  
      $.post({
          url: 'processor.php',
          data: $('#checklist').serialize(),
          dataType: 'html',
          success: function(data, status, jqXHR) {
             $('div.successmessage').html(data);
             //success callback function
             alert (success);
          }, 
          error: function() {
             //error callback function
             alert (failure);
          } 
      });
  });
  </code></pre>
  
  <p>I know for a fact I'm having problems with the AJAX code above. This is critical, I cannot get this to work. I've never tried to do anything like this before and I decided to try and put my mind to it and get this done. Ugh. </p>
  
  <p><strong>processor.php</strong></p>
  
  <pre><code>&lt;?php
  require 'connect.php';
  
  $entry  = $_POST['entry'];
  $checked = $_POST['checked'];
  
  
  $num_items = count($entry);
  for ($i = 0; $i &lt; $num_items; $i++)
  {
      $sql="INSERT INTO checklist (Entry, Checked, SID)
  VALUES ($checked, $entry, session_id()) WHERE SID = '".session_id()."'";}
  
  
  mysql_close($con);
  
  ?&gt;
  </code></pre>
  
  <p>^And this is rough and totally unfinished. </p>
  
  <ol>
  <li><p>How do I interact with dynamic fields and loop through them to pipe
  into the database via mysql and php?</p></li>
  <li><p>How do I get it to update the index.php page with the new values for
  a seamless addition of new items just added?</p></li>
  <li><p>How can I get the AJAX to work?</p></li>
  </ol>
  
  <p><em>Please</em> be very specific for my sake. I'm very, very new to using AJAX.</p>