0

我有这样的形式

<form id="abc">
<div>
<select >
<option id= "1"> ha1 </option>
<option id= "1"> ha2 </option>
<option id= "1"> ha3 </option>
<option id= "1"> ha4 </option>
</select>
<input type="submit">
</div>
</form>

对于表单提交，我使用过

 $(document).ready(function() {

        $('#abc').submit(function(){

            $.post('filter.php', $(this).serialize(), function(data){

          $('#abc').reset();  //(this).reset();  

            });             

            return false;


        });

    });

这里重置不起作用。重置的任何问题我都没有。表单提交后，我想用 db 值刷新表单（以显示刚刚选择的值）。

提交后如何刷新页面或 div 刷新。

4

5 回答 5

2 
$(document).ready(function() {
    $('#abc').submit(function(){
        $.post('filter.php', $(this).serialize(), function(data){
        window.location.href=window.location.href;  
        });             
        return false;
    });

});

通过将 href 设置为实际页面来重新加载页面:)

或者你也可以使用这个： 

parent.document.getElementById("abc").reload();

顺便说一句：我没有看到您的服务器端代码，您必须渲染选定的值，当然，我假设您正在返回它们，我的回答不涵盖服务器端场景。我的代码仅适用于您在将所选值保存到数据库后从服务器返回的情况。

于 2012-11-25T19:12:47.223 回答
0

正如 doniyor 在回答中所说，您可以使用 window.location.href 刷新页面，但这不会使用您刚刚写入数据库的值填充您的表单。

您有两个选项可用于使用数据库填充表单，在您的情况下可能需要实现这两个选项（取决于您）。

第一个是在您第一次加载 html 时填充表单。这可以通过对数据库进行查询并获取值来在服务器端完成，然后根据值设置正确的单选按钮，如下所示：

<input type="radio" selected="selected" />

另一个选项是将复选框设置为与 jquerys .prop() 方法异步。这要求您的标签具有唯一的 ID（无论如何它们都应该具有）。例子：

$("#yourIDHere").prop('checked',true);

在后一种情况下，您可以让发布的脚本输出正确的 ID 以供使用。这取决于您的判断，并且取决于您的情况，但希望这个答案能够为您指明正确的方向。

此致

于 2012-11-25T19:19:57.217 回答
0

如果您拥有服务器端代码，则可以在响应中返回值，然后在回调中使用这些值填充字段。

假设这是您的响应 JSON：

{
    data: [{
             "username": "john doe"
    }]
}


$('#abc').submit(function(){
    $.post('filter.php', $(this).serialize(), function(data){

        $('#abc').reset();  //(this).reset();  

        $('input#username').val(data.username);
    });             

    return false;
});
于 2012-11-25T19:14:19.160 回答
0

尝试使用这个，

$('#abc').submit(function(){
    $.post('filter.php', $(this).serialize(), function(data){

        $('#abc').find('input:text, input:password, input:file, select, textarea').val('');
        $('#abc').find('input:radio, input:checkbox')
        .removeAttr('checked').removeAttr('selected');

    });             

  return false;
});
于 2012-11-25T19:22:03.550 回答
0

使用纯 JavaScript 重置表单字段。

document.getElementById("formid").reset();

于 2022-02-11T13:58:18.787 回答