Question

有三页pricing.php，disc.php，disc_save.php。 Pricing.php是我的主要表单，因此它包含使用ajax发布数据的脚本。

pricing.php

<script>
// button #disc_save_amt is present in disc.php

    $('#disc_save_amt').live('click', function(){ 

        $.ajax({
            url:"disc_save.php",//url to submit
            type: "post",
            dataType : 'json',
            data : {
            'discount_type' : $('#discount_type').val(),
            'discount' : $('#disc_in').val()    
        },
        success: function(){}

        });

    return false;
    });

</script>

disc.php包含点击后数据插入数据库的按钮。

<div id="disc_display">
    <form method="post" id="disc_data" action="">

        <table>
            <tr>
                <td>
                    <select name="discount_type" id="discount_type">
                        <option selected="selected" value="percent">Percent</option>
                        <option value="fixed">Fixed</option>
                    </select>

                </td>

                <td>
                    <input type="text" value="0" id="disc_in" name="disc_amt"/>
                </td>
            </tr>

            <tr>
                <td>
                    <input type="button" value="save" name="disc_save_amt" id="disc_save_amt" 
                     style="width:auto; height:auto; font-size:12px" />
                </td>

                <td>
                     <button name="cancel" id="cancel" onclick="loadXMLDoc_disc_cancel()">cancel</button>
                </td>
            </tr>
        </table>

    </form>
</div>

以下是disc_save.php

<?php

    //$total= $_SESSION['total'];

    $discount_type= $_POST['discount_type'];
    $discount= $_POST['discount'];


    $con = mysqli_connect("localhost","root","","my_db");
    $run= "INSERT INTO discount(discount_type,discount) VALUES('$discount_type','$discount')";
    mysqli_query($con,$run) or die(mysqli_error($con));


?>

当我点击“保存”按钮时，数据被插入到数据库中，但我无法刷新特定div中的结果。即在我的情况下“disc_display”。

我尝试了http://www.2my4edge.com/2013/08/insert-and-view-data-without-refresh.html，也问了Inserting and retrieving data in MySQL using PHP through Ajax。

如何在没有刷新的情况下检索指定div中的结果？

pricing.php form

AFter clicking on 'Add discount' form from 'disc.php' is posted using ajax

Answer 1

如何在不刷新的情况下检索指定div中的结果

稍微修改一下您的脚本，disc_save.php：

$con = mysqli_connect("localhost","root","","my_db");
$run= "INSERT INTO discount(discount_type,discount) VALUES('$discount_type','$discount')";
mysqli_query($con,$run) or die(mysqli_error($con));

// Return output to the ajax request
echo json_encode(array('status'=>'y', 'discount_type'=>$discount_type, 'discount'=>$discount));

在pricing.php中修改您的ajax请求：

$('#disc_save_amt').on('click', function(){ 

    $.ajax({
        url:"disc_save.php",//url to submit
        type: "post",
        dataType : 'json',
        data : {
          'discount_type' : $('#discount_type').val(),
          'discount' : $('#disc_in').val()    
        },
        success: function(response){

           console.log(response);
           // Play with the response accordingly
           if( response.status == "y" ) {

              // Do whatever you want:
              // response.discount_type - Discount Type
              // response.discount      - Discount

              // This will replace your <div id="disc_display"></div> with response
              $('#disc_display').html(response.discount_type);
           }
       }

    });
});

Answer 2

首先，您需要从PHP代码返回状态为OK的JSON对象。您可以添加要返回到该JSON对象的数据，并从ajax调用中的success函数访问它。我修改你的php更安全。

<强> PHP

<?php

$discount_type= $_POST['discount_type'];
$discount= $_POST['discount'];

$mysqli = new mysqli("localhost", "my_user", "my_password", "world");

/* check connection */
if (mysqli_connect_errno()) {
    printf("Connect failed: %s\n", mysqli_connect_error());
    exit();
}

/* Insert rows */
$stmt = $mysqli->prepare("INSERT INTO discount(discount_type, discount) VALUES(?, ?)");
$stmt->bind_param('ss',$discount_type, $discount);
$stmt->execute();

if ($mysqli->affected_rows==1){
    echo json_encode(array(
        'status'=>'OK', 
        'discount_type'=>$discount_type, 
        'discount'=>$discount
    ));
} else {
    echo json_encode(array(
        'status'=>'Error',
    ));
}

$stmt->close();

<强> JS

$('#disc_save_amt').click( function(){ 

    $.ajax({
        url:"disc_save.php",//url to submit
        type: "post",
        dataType : 'json',
        data : {
        'discount_type' : $('#discount_type').val(),
        'discount' : $('#disc_in').val()    
    },
    success: function(data){}
        if (data.status == "OK") {
            $('#disc_display').append(data.discount_type + ' : ' + data.discount);
        } else {
            $('#disc_display').prepend('Something went wrong!');
        }
    });

return false;
});

Answer 3

您应该在disc_save.php中创建要附加到div的html设计。 Ajax将返回该html响应。您可以将该html指定给Success元素下的特定div。像这样$("#disc_display").html(response);

    $('#disc_save_amt').live('click', function(){ 

        $.ajax({
            url:"disc_save.php",//url to submit
            type: "post",
            dataType : 'json',
            data : {
            'discount_type' : $('#discount_type').val(),
            'discount' : $('#disc_in').val()    
        },
        success: function(response){
             $("#disc_display").html(response);
        }

        });

    return false;
    });

使用ajax在mysql中插入数据后无法刷新div

3 个答案: