Question

您好我正在使用jquery .load（）在div容器中加载一个页面，如下例所示：

jQuery("#ShowOrders").load("saveOrder.php?totalAmount=100" );

在此页面中，我将处理值列表。

对于那些值列表，我将在js函数中执行删除操作，

function removeOrder(sId)
{
var ServiceId = parseInt(sId);
var OrderId = parseInt("<?php echo $_POST['OrderId']; ?>");
alert("ServiceId "+ServiceId+" SessionOrderId "+OrderId);
if(confirm("Are you sure?") == true)
{
  var DeleteIt = "<?php include 'connect.php'; $DeleteOrderDetailsQuery = 'DELETE FROM tblshoppingdetails WHERE orderID = "+OrderId+" AND serviceTypeID = "+ServiceId+"';$ExeDeleteOrdersQuery = mysqli_query($con,$DeleteOrderDetailsQuery);if($ExeDeleteOrdersQuery) { echo '1'; } else { echo $DeleteOrderDetailsQuery; } ?>";
}
alert(DeleteIt);
if(DeleteIt == 1)
{
  alert("Success");
}
}

我无法删除数据库中的记录，即使我能够删除这个我有更大的问题重新加载这个特定的div来显示更新。

我需要帮助

在js
重新加载使用jquery .load（）函数加载的页面。
我可以在其中处理ajax吗？（如果是，请建议我采用这种方法。）

Answer 1

你不能在js中运行sql。假设您有saveOrder.php和removeOrder.php文件的脚本文件。这些文件应包含您的sql查询和逻辑，将结果作为html字符串返回。下面是一个如何构建javascript并处理ajax请求的示例：

$(function() {
    var jqxhr = $.ajax({
        url: 'saveOrder.php',
        type: 'POST',
        dataType: 'html', // data type you are expecting to be returned
        // data you are passing into your saveOrder.php script that runs your sql
        // queries and other logic and returns the result as html
        data: {
            totalAmount: 100
        }
    });

    // on ajax success
    jqxhr.done(function(html){
        console.log("success. order has been saved");
        // assuming saveOrder.php returns html
        // append your list here
        $("#someDiv").empty();
        $("#someDiv").append(html);

        // assuming your list contains a delete button with
        // a data attribute of data-id and where data-id value is the id
        // sql record id you can do the following

        $(".list-item").each(function(index, el) {
            var deleteBtn = $(el).find("#delete");

                deleteBtn.on('click', function(event) {
                    event.preventDefault();

                    // id of the record being deleted
                    // capatured from:
                    // <button data-id="25">Delete</button>
                   var id = $(this).data(id);

                    // here you can run another ajax call
                    var jqxhr = $.ajax({
                        url: 'removeOrder.php',
                        type: 'POST',
                        dataType: 'html',
                        data: {
                            id: id
                        }
                    });

                    // second ajax successful
                    jqxhr.done(function(html){
                        console.log("order removed");

                        // append the updated list
                        $("#someDiv").empty();
                        $("#someDiv").append(html);

                    });

                    jqxhr.fail(function(){
                        console.log("Second Ajax Failed");
                    });
                });

        });

    });

    jqxhr.fail(function(){
        console.log("First Ajax Failed");
    });

});

如何重新加载使用jquery .load函数加载的特定页面

1 个答案: