php - reload multiple table cells with jQuery -

i have many forms in page, each form several inputs. when click submit on form (say form0), inputs send reassign.php,that perform search in db according user inputs, , cell div id="cell0" in table of page reloaded data echoed reassign.php.

<script type="text/javascript"> $(document).ready(function(){     $("#form0").submit(function(){         var myvariables = $(this).serialize();         $('#cell00').load('reassign.php?myvariables=' + myvariables);         return false;     }); });  $(document).ready(function(){     $("#form1").submit(function(){         var myvariables = $(this).serialize();         $('#cell10').load('reassign.php?myvariables=' + myvariables);         return false;     }); }); </script> 

a stripped down version of table:

<table>                   <tr>     <td><div id="cell00"><img src="image0.jpg"/></div></td>     <td><div id="cell01">text1</div></td>     <td><div id="cell02">price1</div></td>     <td><div>              <form name="form0" id="form0">                 <input type="hidden" name="qst" value="0">                 <input type="image" src="reloadred.gif" alt="submit"/>                 <select name="cmb1"><option>cmb1option1</option><option>cmb1option2</option></select>                 <select name="cmb2"><option>cmb2option1</option><option>cmb2option1</option></select>              </form>           </div>     </td>   </tr>   <tr>     <td><div id="cell10"><img src="image0.jpg"/></div></td>     <td><div id="cell11">text1</div></td>     <td><div id="cell12">price1</div></td>     <td><div>              <form name="form1" id="form1">                 <input type="hidden" name="qst" value="0">                 <input type="image" src="reloadred.gif" alt="submit"/>                 <select name="cmb1"><option>cmb1option1</option><option>cmb1option2</option></select>                 <select name="cmb2"><option>cmb2option1</option><option>cmb2option1</option></select>              </form>           </div>     </td>   </tr>                       </table>    

a sample reassign.php:

<?php   session_start();    $myvariables = $_get['myvariables '];   $cmb1 = $_get['cmb1'];   $cmb2 = $_get['cmb2'];   $cmb3 = $_get['cmb3'];   parse_str($myvariables);   $preg=$myvariables;   $link = mysql_connect("localhost", usr, pswrd) or die(mysql_error());  @mysql_select_db("mydb") or die( "unable select database");   mysql_query ("set names 'utf8'");  $query = "select img mytable column1=$cmb1 , column2=cmb2";     if($success = mysql_num_rows($result) > 0) {            while ($row = mysql_fetch_array($result)) {           $image="../imagefolder/".$row[0].".png";        }     }          echo "<img src=\"".$image."\" />"; ?> 

this ok.

now want other cells in table change well, different (and related) data. indeed, in db seach reassign.php, $row[0] echoed (and loaded) in cell00, , want $row[1] send cell01, $row[2] cell02 , on. problem right i'm loading cell0 echoing content. think job calling different php (reassign0.php echo data cell00, reassign1.php echo data cell01) seems rather odd. ideas?

here better approach... can echo json instead of html php script, fields of row. (other code must put in place work you, i'll let research on own)

echo json_encode($row); 

in js, json $.getjson(url, callback) or $.get(url, callback) depending on server configuration

then, loop through cells , inject data in callback

$.getjson('reassign.php?myvariables='+myvariables, function(row){   for(i=0;i<row.length;i++){     $("#cell0"+i).html(row[i]);   } }); 

edit: if data not formatted html (like images), sure in callback. example, if first element image url , rest plain data, can :

$.getjson('reassign.php?myvariables='+myvariables, function(row){   for(i=0;i<row.length;i++){     var content = ( == 0 ) ? '<img src="'+row[i]+'" alt="" />' : row[i];     $("#cell0"+i).html(content);   } });