可编辑数据表PHP MySQL jQuery


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"; }
?>

当它全部运行时,我更新了屏幕上的字段Updates,并显示了"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')