jquery - ajax提交表单后刷新输入

标签 jquery ajax json

我到处搜索,但找不到如何通过 js/jquery/ajax 刷新特定输入字段。

这是我的输入,每个帖子都会发生变化:

<input type='hidden' id='nonce' name='nonce' value=''>
<input type='hidden' id='key' name='key' value=''>

我需要在 ajax 表单提交后刷新此输入,有什么想法吗?

更好的解释: 此 PHP 代码生成随机散列 key 。

<form action="#">

<?php $n->generateFormFields() ?>

</form>

我通过ajax POST发送生成的 key ,问题是当我将代码发送到ajax时, key 在服务器端发生变化,因此下次提交后 key 将是错误的,因为它在ajax响应后没有更改,所以我需要在ajax提交/刷新上面的输入后刷新此代码。

编辑2:

我正在使用这个 php 脚本:

http://github.com/greatwitenorth/php-nonce

该脚本正在 php POST 上运行,但我正在使用 AJAX post,因此我需要以某种方式使用 ajax 刷新 key 。

编辑3:

表格例如:

<form action="#">

<?php $n->generateFormFields() ?>

</form>

上面的 php 函数正在创建哈希键。 我通过 ajax json POST 发送这些散列 key ,发送它们后,我验证该 key 与数据库 key 相同。 - 如果可以继续,如果没有则显示错误。 现在的问题是每次提交表单时关键都发生变化。所以它发生了变化,但在表单上的输入中,它没有改变,因为 ajax 没有刷新页面,所以它将发送与之前相同的键值。

最佳答案

.html 文件

<!DOCTYPE html>

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
 $(document).ready(function(){
    $("#check").click(function(){
        $("#keyvalue").text($("#key").val());
    });
    $("#submit").click(function(){
    var text = $("#text").val();
    var key = $("#key").val();
        $.ajax({
            url: 'trial.php',
            data: {text: text, key:key},
            type: 'POST',
            dataType: 'json',
            success: function(data) {
                if(data.status == "fail"){
                    $("#status").html(data.message);
                }else{
                    $("#status").html(data.message);
                    $("#key").val(data.key);
                    $("#keyvalue").text('');
                }
            }
        });
        return false;
    });
 });
</script>
</head>
<body>
    <form method="post" action="trial.php" onsubmit="return send_form();">
        <input type="text" name="text" id="text"/>
        <input type="hidden" id="key" name="key" value="xsaigoehf7118191"/>
        <button id="submit">Send data and get new key</button>
    </form>
    <br><br>
    <div id="status"></div>
    <br><br>
    <button id="check">What's current value of key?</button> --------> <span id="keyvalue"></span>

    <div id="response"></div>
</body>

</html>

.php

<?php

//You get the form contents here.

$key = isset($_POST['key']) ? $_POST['key'] : "error";
$text = isset($_POST['text']) ? $_POST['text'] : "empty";

//Check them if it matches with DB's entry, if doesn't you set $key = "error";

if($key=="error"){
    $status = "fail";
    $message = "There was some error processing your form.";
    exit;
} else{

    //You generate another random key.
    $random ='';
    for ($i = 0; $i < 10; $i++) {
        $random .= chr(mt_rand(33, 126));
    }

    //Now here in steps save it to your DB. So that when next form is submitted you can match it.
    //And send back response to html file, where ajax will refresh the key.
    $status = "success";
    $message = "
    Your form was processed succesfully<br>
    The text you sent was ".$text.", and the key you sent was ".$key.".
    The new key sent to you can be seen by pressing the button below, has value, ".$random."<br><br>
    ";
    }

    echo json_encode(array("status" => $status, "message" => $message, "key" => $random));

?>

希望这对您有帮助。

关于jquery - ajax提交表单后刷新输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18040177/

相关文章:

javascript - Nivo Slider (raphaeljs) 的外部控件(下一个/上一个)?

javascript - $.get 带有动态数据名称?

json - hive中的多行JSON文件查询

android - 如何使用 Volley 在 JSON 中的数组中获取数组中的元素

javascript - 数据表服务器端处理

javascript - 避免在 .each 循环中继续执行

Jquery:不支持drop事件?

javascript - 从 <div> 添加/删除 <button>?

c# - Ajax 调用 Web API 方法

javascript - 如何访问javascript中有空格的对象参数