从表格单元更新数据库而不刷新页面

Question

I want to make editable cell in table, then when hit 'enter' update database without refreshing whole page.

first of all I populate my table from sql query like:

//up there - no important things

echo'<table> 
        <tr>';                  
        while($row = mysql_fetch_assoc($result))
        {                       
            foreach($row as $key=>$value)
            {
               if(!($value == "id_p" || $value == "pass" || $value == "salt" || $value == "login"))
               {               
               echo'<th>'.$value.'</th>';
               }
            }
        } 
        echo '</tr>';

        if(mysql_num_rows($result2) > 0)
        {
            while($row2 = mysql_fetch_assoc($result2))
            {                           
                echo '<tr>';
                foreach($row2 as $key=>$value)
                {                           
                    if(!($key == "id_p" || $key == "pass" || $key == "salt" || $key == "login"))
                       echo'<td>'.$value.'</td>';
                }
                echo '</tr>';
            }
        }
        else
            echo '<tr><td colspan="9">Brak wyników.</td></tr>';

echo'</table>';

Then i change cell <td> with script (not my script) to

$(function(){
        $("td").click(function(event)
        {
            if($(this).children("input").length > 0)
                    return false;
            var tdObj = $(this);
            var preText = tdObj.html();
            var inputObj = $("<input type='text' />");
            tdObj.html("");
            inputObj.width(tdObj.width())
                .height(tdObj.height())
                .css({border:"0px",fontSize:"17px"})
                .val(preText)
                .appendTo(tdObj)
                .trigger("focus")
                .trigger("select");
            inputObj.keyup(function(event){
                if(13 == event.which) // if ENTER
                { 
                    var text = $(this).val();
                    tdObj.html(text);

 // SOMETHING HERE TO UPDATE DATABASE??

                }
                else if(27 == event.which) {  // if ESC
                        tdObj.html(preText);
                }
              });
                inputObj.click(function(){
                        return false;
                });
        });
});

And now i'm stuck. How can i send new data to update(without refreshing whole page)? I'm not good in js/ajax. i've created new page update_db.php

if(isset($_POST['post_name']))
{
   echo 'processing...';
  //mysql things...
}

but this is all i have.

Answer 1

You can't do that without refreshing unless you use AJAX.

if(13 == event.which) // if ENTER
{ 
    var text = $(this).val();
    tdObj.html(text);
    $.POST("update_db.php", { tdVal: text });
}

You can now get the tdVal in the $_POST of update_db.php

Also I recommend using mysqli instead of mysql since its removed from php 7.