[英]Editable Datatables PHP MySQL jQuery
我有一個從數據庫動態提供的表,這可以正常工作,然后我將數據表功能放在頂部,運行良好,排序,搜索,分頁再次正常工作。
我現在正在尋找能夠編輯行並將數據更新回數據庫並刷新表。
我的桌子結構
<table class="table table-striped table-hover table-bordered" id="tobebookedtable">
<thead>
<tr>
<th style="display:none;">PropID</th>
<th>ProjectNo</th>
<th>Householder</th>
<th>HouseNoName</th>
<th>Street Name</th>
<th>Postcode</th>
<th>Telephone</th>
<th>EPCPlanned</th>
<th>TAM</th>
</tr>
</thead>
<tbody>
<tr>
<?php
$planning = db::getInstance()->query('CALL sp_tobebooked()');
foreach ($planning->results() as $planning) {
?>
<td style="display:none;"><?php echo $planning->PropID; ?></td>
<td><?php echo $planning->ProjectNo; ?></td>
<td><?php echo $planning->Householder; ?></td>
<td><?php echo $planning->HouseNoName; ?></td>
<td><?php echo $planning->StreetName; ?></td>
<td><?php echo $planning->Postcode; ?></td>
<td><?php echo $planning->Telephone; ?></td>
<td><?php echo $planning->EPCPlanned; ?></td>
<td><?php echo $planning->TAM; ?></td>
</tr>
<?php }; ?>
</tbody>
</table>
EPCPlanned是我想要更新的唯一字段。
這是我的jQuery方面的代碼,編輯能力有效,我可以點擊進入單元格並編輯記錄。
<script type="text/javascript">
$(document).ready(function() {
$('#tobebookedtable').dataTable( {
//"bProcessing": true,
//"bServerSide": true,
//"bJQueryUI": true,
"bPaginate": true,
"bStateSave": true
} );
/* Init DataTables */
var oTable = $('#tobebookedtable').dataTable();
/* Apply the jEditable handlers to the table */
oTable.$('td').editable( 'tobebooked_edit.php', {
"callback": function( sValue, y ) {
var aPos = oTable.fnGetPosition( this );
oTable.fnUpdate( sValue, aPos[0], aPos[1] );
//window.location.reload();
},
"submitdata": function ( value, settings ) {
console.log(value);
console.log(settings);
return {
"row_id": this.parentNode.getAttribute('id'),
"column": oTable.fnGetPosition( this )[2]
};
},
"height": "26px",
"width": "100%"
} );
} );
</script>
這是tobebooked_edit.php
<?php
require 'core/init.php';
$table="temp_tobebooked";
$rawdata = $_POST;
$query = "show columns from $table";
$result= mysql_query($query) or die(mysql_error());
$fields = array();
while ( $row = mysql_fetch_assoc($result) )
{
$fieldname = $row['Field'];
array_push($fields, $fieldname);
}
$id = $rawdata['row_id'];
$value = $rawdata['value'];
$column = $rawdata['column'];
$column = $column + 1;
$fieldname = $fields[$column];
$value = utf8_decode($value);
$query = "update $table set $fieldname = '$value' where PropID = '$id'";
$result = mysql_query($query);
if (!$result) { echo "Update failed"; }
else { echo "UPD: $value"; }
?>
當它全部運行並且我更新記錄時屏幕上的字段更新並顯示“UPD:”和輸入的值。
但是當我檢查我的數據庫時,沒有更新記錄。 沒有任何錯誤顯示
如何在數據庫中更新數據?
首先,我認為這一點
<tr>
<?php
$planning = db::getInstance()->query('CALL sp_tobebooked()');
foreach ($planning->results() as $planning) {
?>
應該
<?php
$planning = db::getInstance()->query('CALL sp_tobebooked()');
foreach ($planning->results() as $planning) {
?>
<tr>
然后,用
"row_id": this.parentNode.getAttribute('id'),
對於每個td元素,選擇tr元素並搜索不存在的id屬性
首先根據rsella的評論你需要在循環中移動行。 其次,懷疑你是在一個隱藏的單元格中持有ID,這實際上是可編輯元素的兄弟,而不是父元素。 嘗試將表結構更改為以下內容
<tbody>
<?php
$planning = db::getInstance()->query('CALL sp_tobebooked()');
foreach ($planning->results() as $planning) {
?>
<tr id="<?php echo $planning->PropID; ?>" >
<td><?php echo $planning->ProjectNo; ?></td>
<td><?php echo $planning->Householder; ?></td>
<td><?php echo $planning->HouseNoName; ?></td>
<td><?php echo $planning->StreetName; ?></td>
<td><?php echo $planning->Postcode; ?></td>
<td><?php echo $planning->Telephone; ?></td>
<td><?php echo $planning->EPCPlanned; ?></td>
<td><?php echo $planning->TAM; ?></td>
</tr>
<?php };
?>
</tbody>
這應該意味着父有一個ID,因此this.parentNode.getAttribute('id')
應該能夠返回所需的值。
由於您只編輯EPCPlanned單元格,因此可以選擇其他方法
<tbody>
<?php
$planning = db::getInstance()->query('CALL sp_tobebooked()');
foreach ($planning->results() as $planning) {
?>
<tr>
<td><?php echo $planning->ProjectNo; ?></td>
<td><?php echo $planning->Householder; ?></td>
<td><?php echo $planning->HouseNoName; ?></td>
<td><?php echo $planning->StreetName; ?></td>
<td><?php echo $planning->Postcode; ?></td>
<td><?php echo $planning->Telephone; ?></td>
<td id="<?php echo $planning->PropID; ?>"><?php echo $planning->EPCPlanned; ?></td>
<td><?php echo $planning->TAM; ?></td>
</tr>
<?php };
?>
</tbody>
並在你的JQuery中更改"row_id": this.parentNode.getAttribute('id')
到this.getAttribute('id')
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.