title: PHP\MYSQL\AJAX(?) - Struggling with how to dynamically update form without invoking page refresh
body: <p>Ok, so I'm fairly new to dynamically updating a database without invoking a page refresh. I'm trying to create, on a far simpler scale, something like <a href="http://mytinytodo.net/" rel="nofollow">http://mytinytodo.net/</a></p>
  
  <p>The end goal that I'm trying to hit here is for the program to:</p>
  
  <ol>
  <li>Be able to dynamically generate fields (Complete)</li>
  <li>Populate web page with existing entries in MYSQL database on load via PHP (Complete)</li>
  <li>Allow user to "Check All" or "Uncheck All" (Complete)</li>
  <li>Remember a user's personal list.. Cookies maybe? <strong>Help!</strong></li>
  <li>Update the database with any changes the user makes to existing list items or commit newly created list items. AJAX? Jquery? <strong>Help!</strong></li>
  </ol>
  
  <p>I've spent a few hours into this little project so far and here is what I have:</p>
  
  <p><strong>index.php:</strong></p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
      &lt;head&gt;
      &lt;metacharset="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";
      $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="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" action="" method=""&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;\" /&gt;";
              echo "&lt;input type=\"checkbox\" value=\"\" 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"&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>In summary, how can I discreetly update the users list when an "onchange" happens to one of the form fields without having to throw the whole page at a post file and then redirect the url back? I don't want a refresh to happen.</p>
  
  <p>How do I create a cookie that remembers who the user is and what his personal list of items are? </p>
  
  <p>This is my first real attempt at something like this. Obviously I'm not near the "styling" phase yet, so there's no CSS or anything flashy. </p>
  
  <p><strong>EDIT:</strong>  So I now have (essentially) unique session variables which I'm using to distinguish visitors from one another and when they create their new "checklist" in the database their 'uid' will be logged there. So the system will 'remember' them for as long as the session lasts... I think this is what some of you were intimating I do. </p>