0

我正在使用 jQuery 验证插件来验证表单。此外，在输入字段之一模糊时，我想执行一个修改另一个表单元素（选择列表）的函数，但前提是输入字段有效。

所以我的jQuery代码是这样的：

$(document).ready(function()
  {
   $("#form_name").validate(
     {rules: 
        {
         input_field_name: {remote: validation_url}
        ,input_field_name2: {remote: validation_url2}
        }
     ,messages:
        {
         input_field_name: {remote: jQuery.format("Error message")}
        ,input_field_name2: {remote: jQuery.format("Different error message")}
        }
     });
   $("#input_field_name").blur(function()
     {
       if ($("#input_field_name").valid())
         {$.ajax({dataType: "json"
                      ,url: "url_to_get_new_select_list_options"
                     ,data: {input_field_name : $("#input_field_name").val()}
                  ,success: function(data)
                                {
                                 $select_options = $("#example_select_list");
                                 $select_options.empty();
                                 $.each(data.tp, function(key, val)
                                         {$select_options.append('<option id="'+val.id+'">'+val.desc+'</option>')}
                                       )
                                }
                })
          }
     });
  });

我的html是这样的：

<form name="form_name" id="form_name" method="post" action="url_to_process_form">
<select name="example_select_list" id="example_select_list">
<option value="">Please select...</option>
<option value="11111">One</option>
<option value="22222">Two</option>
<option value="33333">Three</option>
<option value="44444">Four</option>
<option value="55555">Five</option>
</select>

<input id="input_field_name" type="text" size=10 maxlength=20 name="input_field_name2">
<input id="input_field_name2" type="text" size=10 maxlength=20 name="input_field_name2">   

</form>

据我所知，问题是模糊函数是在 validate 之前执行的。有效返回假，所以我的模糊函数没有做任何有用的事情。如果我再次模糊该字段（不修改其值），. valid然后返回 true 并且我的选择列表会根据需要更新。

但我不知道如何验证表单（或只是那个特定的输入字段）所以 . valid在第一次通过 blur 函数时返回 true。

对不起这样一个新手问题。

4

1 回答 1

0

好的我自己解决了这个问题，并将解决方案记录在这里以供后代使用。

我最初认为排队验证和模糊功能存在问题，并试图解决这个问题。我终于发现问题是在validate中远程ajax调用有轻微的滞后——当我检查表单字段是否有效时，ajax响应还没有到达。

我使用 setInterval 解决了这个问题，如下所示：

$("#input_field_name").blur(function()
    {
     var intrvl = window.setInterval(checkPendingRequest,1000);
     function checkPendingRequest() 
         {
          if ($.active < 1)  //Checks if there are any open Ajax requests
              {
               if ($("#input_field_name").valid())
                   {$.ajax({dataType: "json"
                                ,url: "url_to_get_new_select_list_options"
                               ,data: {input_field_name : $("#input_field_name").val()}
                            ,success: function(data)
                                {
                                 $select_options = $("#example_select_list");
                                 $select_options.empty();
                                 $.each(data.tp, function(key, val)
                                     {$select_options.append('<option id="'+val.id+'">'+val.desc+'</option>')}
                                 )
                                }
                          })
                    window.clearInterval(intrvl);
                   }
              }
         }
    }
)

我希望有一天能帮助别人。

于 2013-05-04T02:57:15.347 回答