javascript - 从 HTML 表更新 SQL Server 数据

问题描述

我有下表：

<table id="skuTable" role="grid">
    <thead>
        <th class="skuRow">Orden</th>
        <th>Fecha Fab.</th>
        <th class="skuRow">Norden</th>
        <th>Color</th>
        <th>Cliente</th>
        <th>Metros</th>
        <th>Tiempo</th>
        <th>Fecha Ent.</th>
        <th>Operario</th>
        <th class="skuRow">Editar</th>
    </thead>
    <tbody>

我从机器上获取数据 41

<?php
$sql = "SELECT DISTINCT  Orden, FFab, N_Orden=Ordenes.OF_N_Orden, Color, Client, Metros, Tiempo, FEnt,Operario
        FROM ((
                Ordenes INNER JOIN VCLIENTE ON VCLIENTE.Clie_codigo = Ordenes.OF_Cod_Cli
            ) INNER JOIN ARTITTEC ON ARTITTEC.Tec_codigo = Ordenes.OF_Cod_Art
        ) 
        INNER JOIN VTiempos ON  VTiempos.Of_n_orden= Ordenes.OF_N_Orden 
            AND Vtiempos.OF_LIN =Ordenes.OF_Lin
        ORDER BY Orden asc, Fecha asc";

$stmt = sqlsrv_query($conn, $sql);
if ($stmt === false) {
    die(print_r(sqlsrv_errors(), true));
}

while ($row = sqlsrv_fetch_array($stmt, SQLSRV_FETCH_ASSOC)){
?>
I write the data in the columns

      <td class="orden" id="orden-<?= intval($row['Orden']) ?>"><?php echo $row['Orden'] ?></td>
        <td role="gridcell"><?php echo $row['FFab']; ?></td>
        <td class="norden" align="center" id="norden-<?= intval($row['N_Orden']) ?>"><?php echo $row['N_Orden']; ?></td>
        <td role="gridcell"><?php echo $row['Color']; ?></td>
        <td role="gridcell"><?php echo $row['Client']; ?></td>
        <td role="gridcell"><?php echo $row['Metros']; ?></td>
        <td role="gridcell"><?php echo $row['Tiempo']; ?></td>
        <td role="gridcell"><?php echo $row['FEnt']; ?></td>
        <td role="gridcell"><?php echo $row['Operario']; ?></td>
        <td><input type="button" class="edit" name="edit" value="Edit"></td>

        </tr></b></font>
        <?php { ?>
    </tbody>
</table>

<div class="k-pager-wrap k-grid-pager k-widget k-floatwrap" data-role="pager">
    <span class="k-pager-info k-label"></span>
</div>

编辑功能的 JavaScript：

$(document).on("click", "#skuTable .edit", function () {
    var $this = $(this);
    var tds   = $this.closest('tr').find('td').filter(function () {
        return $(this).find('.edit').length === 0;
    });
    if ($this.val() === 'Edit') {
        $this.val('Save');
        if ($this.id !== '.orden') {
            tds.prop('contenteditable', true);
        }
    }
    else {
        var isValid = true;
        var errors  = '';
        $('#myDialogBox').empty();
        var elements = tds;
        if (tds.find('input').length > 0) {
            elements = tds.find('input');
        }
        var dict = {};
        elements.each(function (index, element) {
            var type  = $(this).attr('class');
            var value = (element.tagName == 'INPUT') ? $(this).val() : $(this).text();
            console.log(type);
            // ----- Switch statement that provides validation for each table cell -----
            switch (type) {
                case "norden":
                    dict["N_Orden"] = value;
                    break;
                case "orden":
                    dict["Orden"] = value;
                    break;
            }
        })
        if (isValid) {
            console.log(dict);
            $this.val('Edit');
            tds.prop('contenteditable', false);
            var request = $.ajax({
                type: "POST", url: "update.php", data: dict
            });

            request.done(function (response, textStatus, jqXHR) {
                if (JSON.parse(response) == true) {
                    console.log("row updated");
                }
                else {
                    console.log("row failed to updated");
                    console.log(response);
                    console.log(textStatus);
                    console.log(jqXHR);
                }
            });

            // Callback handler that will be called on failure
            request.fail(function (jqXHR, textStatus, errorThrown) {
                // Log the error to the console
                console.log(textStatus);
                console.log(jqXHR);
                console.error("The following error occurred: " + textStatus, errorThrown);
            });

            // Callback handler that will be called regardless
            // if the request failed or succeeded
            request.always(function () {

            });
        }
        else {
            alert(errors);
        }
    }
});

脚本更新.php：

<?php
$Orden  = $_POST['Orden'];
$NOrden = $_POST['NOrden'];
$host   = "xxxxxxxxxx";
$dbName = "xxxxx";
$dbUser = "xxxxxxxxxxxxxx";
$dbPass = "xxxxxxxxxxxx";
$pdo    = new PDO("sqlsrv:server=" . $host . ";Database=" . $dbName, $dbUser, $dbPass);
$sql    = "UPDATE Ordenes SET OF_OrdenOFs = '$Orden' WHERE OF_N_Orden = '$NOrden'";
$stmt   = $pdo->prepare($sql);
//$stmt->bindValue('[:SKU Group]', $SKU);
//$stmt->bindValue(':Group_ID', $Group_ID)  
$result = $stmt->execute();
echo json_encode($result);
if (!$result) {
    echo json_encode(sqlsrv_errors());
}
?>

目前，当我按下编辑按钮时，它可以让我编辑Order字段，并且保存显然会为我保存它。但是刷新页面时，记录显示为空白（即如果数据库中没有数据，则继续保持空白，如果之前有数据，则不仅不更改它，而且还删除它）。

我能在什么方面失败？

标签： javascriptphphtmlsql-serverajax

javascript - 从 HTML 表更新 SQL Server 数据

问题描述

解决方案

推荐阅读