title: Add data dynamically to a table row
body: <p>This problem is related to my previous question in this <a href="https://stackoverflow.com/questions/5892526/post-data-from-table-row-like-json-format">link</a>. Now, what I'm trying to do is do the opposite thing. I have here a dynamic table (where you can add and delete rows) and whatever is the data that the user input in the latest use of table (trigger by a button) should be retrieve and be posted in the same table (if the same button is clicked).</p>
  
  <p>Here's the code that I used to get the data from my dynamic table:</p>
  
  <pre><code>$('#tableSearchMainAccount1 tr').each(function(){  
  var td = '';                   
     if ($(this).find("td:first").length &gt; 0) {    // used to skip table header (if there is)            
        $(this).find('option:selected').each(function(){
           td = td + $(this).text()+ ',';
        });
     td = td + $(this).find('input').val();
     filt[ctr]=td;
     ctr += 1;           
     } 
  });   
  alert (filt);  //alert output like  name,equals,ann,age,equals,11
  </code></pre>
  
  <p>Now, what I want to do is that when I click the button again, this previous input data will be posted again in my dynamic table.</p>
  
  <p>My table is something that looks like this:</p>
  
  <pre><code>&lt;table&gt; &lt;tr&gt;&lt;th&gt;field&lt;/th&gt;&lt;th&gt;comparison&lt;/th&gt;&lt;th&gt;value&lt;/th&gt;&lt;/tr&gt;   
   &lt;tr&gt;
      &lt;td&gt;
        &lt;select style="width:5em;" class="field"&gt;
          &lt;option&gt;name&lt;/option&gt;
          &lt;option&gt;age&lt;/option&gt;
          &lt;option&gt;sex&lt;/option&gt;
        &lt;/select&gt;
      &lt;/td&gt;
      &lt;td&gt;
        &lt;select style="width:5em;" class = "comp"&gt;
          &lt;option&gt;equals&lt;/option&gt;
          &lt;option&gt;starts with&lt;/option&gt;
          &lt;option&gt;not equal to&lt;/option&gt;
        &lt;/select&gt;
      &lt;/td&gt;
      &lt;td&gt;&lt;input type="text" class = 'value'&gt;&lt;/td&gt;
      &lt;td&gt;&lt;img class="add" src="css/images/add.png" /&gt;&lt;/td&gt; // this is used to add new row
   &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>The last data that a user input in the table should be displays in the table when table  shows again. How do I add the data to my dynamic table? </p>
  
  <p><b>EDIT:</b><br>
  When the button is clicked, a dialog opens which contains my dynamic table and every time a user close the dialog, all the row from that table will be gone same as the data the user entered. I already create a variable that holds the latest inputted data in the table. So when the button click again, I want the table to generate or displays the last input data by the user. The output should be the same as the latest input data.</p>