2012-06-25 65 views
0

現在我的頁面containts編輯字段集和JEditable腳本:如何在JEditable/JQuery中事件後保存更新後的值?

<html> 
<head> 
    <script type="text/javascript" src="jquery-1.7.2.min.js"></script> 
    <script type="text/javascript" src="jquery.jeditable.js"></script> 
</head> 
<body> 
    <table border='1'> 
    <div id="load-button" style="border:1px solid black; background-color:white;padding:5px;cursor:pointer;width:200px;text-align:center;border-radius:4px;">Load button</div> 

    <script type="text/javascript" charset="utf-8"> 
     $(function() { 
      $(".field").editable("echo.php", { 
       indicator : "<img src='img/indicator.gif'>", 
       tooltip : "Move mouseover to edit...", 
       event  : "mouseover", 
       style : "inherit" 
      }); 
     }); 
    </script> 
    <?php 
     mysql_connect('localhost', 'root','') or die('connect'); 
     mysql_select_db('jquery_test') or die('select_db'); 
     $query=mysql_query('SELECT * FROM labels'); 
     while ($data=mysql_fetch_assoc($query)) 
     { 
      echo '<b class="field" style="display: inline">'.$data['text'].'</b><br >'; 
     } 
    ?> 


</body> 
</html> 

但它不能正常工作:在我的領域,新的輸入值,並按點擊「進入」,那麼場改變了他的價值到「點擊編輯」,但我需要該字段繼續顯示更新的值。我該怎麼做?我應該改變什麼?

+0

另外,請告訴我,我可以從PHP腳本返回值? – user1477886

+1

請向我們展示使用php生成的最終HTML。 –

回答

0

在你的jQuery代碼我有這樣的事情 - 這是.fnUpdate這確實是關鍵部分...

var tableElement = $(".field"); 
tableElement.editable("echo.php", { 
      style : "inherit", 
      "callback": function(sValue,y){ 

        //Grab the cell position 
        var aPos = tableElement.fnGetPosition(this); 
        tableElement.fnUpdate(sValue, aPos[0], aPos[1]); 
      },{ 

       "submitdata" : "OK" 
}); 

tableElement.fnDraw();