【问题标题】:Clear search field not removing form data清除搜索字段不删除表单数据
【发布时间】:2013-04-30 07:18:33
【问题描述】:

我正在使用 Jquery,我有一个用于搜索值的文本输入类型和一个用于清除搜索字符串的按钮。

我遇到的问题是当我单击清除搜索按钮时清除搜索字段时,输入文本中的值被清除,但是表单数据没有被清除,在浏览器控制台中我可以看到我的输入文本用于搜索字段。

以下代码用于清除输入文本中的值

$(':input','#myform')
    .not(':button, :submit, :reset, :hidden')
    .val('')
    .removeAttr('checked')
    .removeAttr('selected');  

我尝试过使用

$( '#myform' ).each(function(){
    this.reset();
});

但它也没有解决问题。

当我点击清除搜索按钮时,如何清除输入文本字段以及表单数据?

表单元素

<form id="myform">
<input id="desc">       
<a href="#" class="easyui-linkbutton" onclick="getSearch()">Filter</a>
<a href="javascript:void(0)" class="easyui-linkbutton"
onclick="removeFilter()">Clear</a>  
</form>

编辑 1

function getSearch(){
            $('#dg').datagrid('reload',{
                desc: $('#desc').val(),
                            search: 'true',                                
                            loadValues: 'false'
            });
        }

【问题讨论】:

  • 表单数据是什么意思
  • 提交表单时,搜索字段的值是否发送到服务器?我认为当您使用javascript从中删除字段文本时,控制台行为不会生效。
  • @ArunPJohny 我所说的表单数据是指正在发送到服务器的数据。当我按下清除按钮时,我仍然可以看到正在发送到服务器的值,即使输入字段文本被清除,我也可以在服务器中打印值。
  • @Mojtaba 我所说的表单数据是指发送到服务器的数据。当我按下清除按钮时,我仍然可以看到正在发送到服务器的值,即使输入字段文本被清除,我也可以在服务器中打印值。
  • 请在此处粘贴您的整个代码。更容易看到你想要做什么。

标签: jquery jquery-plugins jquery-easyui


【解决方案1】:

您可以使用以下内容清理字段和表单:

function clearForm() {
    // restore comboboxes to original value
    $("form select").each(function(){
          var id = $(this).attr('id');
          $(this).val($("#"+id +" option:first").val());
          $(this).trigger("change");
    });

    // empty form fields
    $("#myform").find(":input[type=text]").val("");
    $('.combo-value').each(function() {
        $(this).val("");
    });
    $('#myform').find(':checked').each(function() {
        $(this).removeAttr('checked');
    });
    // clear dateboxes - do not delete either line!
    $('.easyui-datebox').each(function(){
            //just type something random to force the hidden field to update
        $(this).datebox('setValue', 'dummy');
        $(this).datebox('setValue', '');
    });
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多