2016-12-28 32 views
0

我正在使用可編輯引導數據表。我想要做的就是編輯的單元格時更新MySQL數據庫:如何檢測用引導程序數據表編輯的單元格?

的index.php:

<!DOCTYPE html> 
<html> 
<head> 
    <link rel="stylesheet" type="text/css" href="http://cdn.datatables.net/1.10.11/css/jquery.dataTables.min.css" /> 
</head> 
<body> 
    <table id="myTable" class="stripe"> 
     <thead> 
      <tr> 
       <th>id</th> 
       <th>First Name</th> 
       <th>Last Name</th> 
       <th>Email</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
       <th>1</th> 
       <td>Elliott</td> 
       <td>Beaty</td> 
       <td>[email protected]</td> 
      </tr> 
      <tr> 
       <th>2</th> 
       <td>Joe</td> 
       <td>Dirt</td> 
       <td>[email protected]</td> 
      </tr> 
      <tr> 
       <th>3</th> 
       <td>John</td> 
       <td>Doe</td> 
       <td>[email protected]</td> 
      </tr> 
      <tr> 
       <th>4</th> 
       <td>Jane</td> 
       <td>Doe</td> 
       <td>[email protected]</td> 
      </tr> 
      <tr> 
       <th>5</th> 
       <td>Billy</td> 
       <td>Bob</td> 
       <td>[email protected]</td> 
      </tr> 
      <tr> 
       <th>6</th> 
       <td>Bobby</td> 
       <td>Axlerod</td> 
       <td>[email protected]</td> 
      </tr> 
     </tbody> 
    </table> 
</body> 
</html> 
<script src="https://code.jquery.com/jquery-1.12.2.min.js"></script> 
<script src="http://cdn.datatables.net/1.10.11/js/jquery.dataTables.min.js"></script> 
<script src="https://raw.githubusercontent.com/ejbeaty/CellEdit/master/js/dataTables.cellEdit.js"></script> 
<script src="basic.js"></script> 

basic.js:

$(document).ready(function() { 
    var table = $('#myTable').DataTable(); 

    table.MakeCellsEditable({ 
     "onUpdate": myCallbackFunction 
    }); 
}); 

function myCallbackFunction(updatedCell, updatedRow, oldValue,row) { 
    console.log("The new value for the cell is: " + updatedCell.data()); 
    console.log("The old value for that cell was: " + oldValue); 
    console.log("The values for each cell in that row are: " + updatedRow.data()); 
    jQuery.ajax({ 
     type: "POST", 
     url: "update.php", 
     data: 'new='+ updatedCell.data(), 
     cache: false 
    }); 
} 

update.php:

require('database.php'); 
$new = @$_POST['new']; 
$pdo = $db->prepare("UPDATE data SET new=? WHERE id=?"); 
$pdo->execute(array($update)); 

我很難找出我編輯的細胞。所以當我改變例如「Joe」到「Alan」時,我需要的信息是id:1row:First name。我想知道,如果dataTables已經有這個信息的變量,例如updatedRow.data()


一個加法:

控制檯給我的輸出:

[Log] The new value for the cell is: Alan 
[Log] The old value for that cell was: Joe 
[Log] The values for each cell in that row are: 2,Alan,Dirt,[email protected] 

所以我現在的想法是解析updatedRow.data()得到編輯的單元格

+0

'數據:{新:updatedCell.data()}'的替代數據:' '新=' + updatedCell.data(),' –

回答

1

變化data: {new:updatedCell.data()},的id而不是data: 'new='+ updatedCell.data(),

像波紋管:

$.ajax({ 
    url: "update.php", 
    type: "POST", 
    data: {new:updatedCell.data()}, 
    contentType: false, 
}).done(function (ex) { 
    //alert(updatedRow.data()); 
    var final_data = updatedRow.data(); 
    var split_data = final_data.split(","); 

    alert("Id : "+ split_data[0] + "Email : " + split_data[3]);  
}).fail(function (ex) { 
    console.log('failed'); 
}); 
+0

謝謝!但是這並不能告訴我編輯過的單元格在哪一行。 – Jarla

+0

哪些信息要顯示? –

+0

我更新了我的問題,因爲我剛剛有一個想法。我需要的信息例如,如果我將'Joe'換成'Alan'就是id和行。在那種情況下,它會是'2'和'First Name' – Jarla

相關問題