簡體   English   中英

可編輯的數據表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"; }
?>

當它全部運行並且我更新記錄時屏幕上的字段更新並顯示“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.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM