使用ajax显示成功后的值而不刷新页面

i am adding the value to database by using ajax after adding i want to display the value in front end but now after success i am using window.location to show the data because of this the page getting refresh,i don't want to refresh the page to show the data ,anyone guide me how to do this.

在添加了ajax后，我使用ajax将值添加到数据库中，我希望在前端显示该值，但在成功之后，我使用了窗口。位置显示数据因为这个页面正在刷新，我不想刷新页面来显示数据，任何人都可以指导我怎么做。

below is my ajax

下面是我的ajax

$(function() {
    $(".supplierpriceexport_button").click(function() {

    var pricefrom = $("#pricefrom").val();
    var priceto =  $("#priceto").val();
    var tpm =  $("#tpm").val();
    var currency =  $("#currency").val();


    var dataString = 'pricefrom='+ pricefrom +'&priceto='+priceto+'&tpm='+tpm+'&currency='+currency;


    if(pricefrom=='')
    {
    alert("Please Enter Some Text");
    }
    else
    {
    $("#flash").show();
    $("#flash").fadeIn(400).html;

    $.ajax({
    type: "POST",
    url: "supplierpriceexport/insert.php",
    data: dataString,
    cache: false,
    success: function(html){
    $("#display").after(html);

    window.location = "?action=suppliertargetpiceexport";
    $("#flash").hide();
    }
    });
    } return false;
    });
    });

3 个解决方案

#1

The code that you are using to post the data needs to return some meaningful data, JSON is useful for this, but it can be HTML or other formats.

您用来发布数据的代码需要返回一些有意义的数据，JSON是有用的，但它可以是HTML或其他格式。

To return your response as JSON from PHP, you can use the json_encode() function:

要从PHP返回JSON响应，可以使用json_encode()函数:

$return_html = '<h1>Success!</h1>';
$success = "true";

json_encode("success" => $success, "html_to_show" => $return_html);

In this piece of code, you can set your dataType or JSON and return multiple values including the HTML that you want to inject into the page (DOM):

在这段代码中，您可以设置您的数据类型或JSON，并返回多个值，其中包括您想要插入到页面中的HTML (DOM):

$.ajax({
    type: "POST",
    url: "supplierpriceexport/insert.php",
    data: dataString,
    cache: false,

    //Set the type of data we are expecing back
    dataType: json

    success: function(return_json){

        // Check that the update was a success
        if(return_json.success == "true")
        {
            // Show HTML on the page (no reload required)
            $("#display").after(return_json.html_to_show);
        }
        else
        {
            // Failed to update
            alert("Not a success, no update made");
        }
});

You can strip out the window.location altogether, else you won't see the DOM update.

你可以把窗户剥掉。完全位置，否则您不会看到DOM更新。

#2

Just try to return the values that you need from the ajax function.Something like this might do.

只要尝试返回ajax函数所需的值。像这样的东西可能有用。

In your insert.php

在你insert.php

echo or return the data at the end of the function that needs to be populated into the page

回显或返回需要填充到页面中的函数末尾的数据

$.ajax({
    type: "POST",
    url: "supplierpriceexport/insert.php",
    data: dataString,
    cache: false,
    success: function(data){
             //Now you have obtained the data that was was returned from the function
             //if u wish to insert the value into an input field try
           $('#input_field').val(data); //now the data is pupolated in the input field 

     }
    });

#3

Don't use window.location = "?action=suppliertargetpiceexport";

不要使用窗口。位置= " ? action = suppliertargetpiceexport”;

This will redirect to the page suppliertargetpiceexport

这将重定向到页面suppliertargetpiceexport

$.ajax({
    type: "POST",
    url: "supplierpriceexport/insert.php",
    data: dataString,
    cache: false,
    success: function(html){
        $('#your_success_element_id').html(html); // your_success_element_id is your element id where the html to be populated
        $("#flash").hide();
    }
});

your_success_element_id is your element id where the html to be populated

your_success_element_id是要填充html的元素id

#1