jQuery驗證插件和表單字段事件之間的交互

我正在使用jQuery驗證插件來驗證表單。另外，對於其中一個輸入字段的模糊，我想執行一個修改另一個表單元素（選擇列表）的函數，但僅當輸入字段有效時。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>

至於我可以告訴的問題是，模糊函數被前執行在哪個時間驗證。有效返回false，所以我的模糊功能沒有任何用處。如果我再次模糊該字段（不修改其值），。有效然後返回true，並根據需要更新我的選擇列表。

但我無法弄清楚如何驗證窗體（或只是特定的輸入欄）如此。有效在首次通過模糊功能時返回true。

對不起，這樣一個新問題。

來源

2013-04-28 TonyB

那麼爲什麼不顯示你的HTML呢？ – Sparky 2013-04-29 01:11:21

默認情況下，該插件已經驗證了「on focus out」。爲什麼你想在這個上面實現一個'blur'處理程序？ – Sparky 2013-04-29 01:14:01

謝謝Sparky。我有其他的驗證規則，但爲了簡潔起見，它們不在我的示例代碼中。我已經添加了它們並示例了html以闡明。我只希望函數在該域的模糊上執行，並且只有在該域的值有效時才執行。這是因爲輸入字段和選擇列表值之間存在依賴關係 - 如果輸入字段值更改（且有效），則選擇列表必須相應更新，然後由用戶重新選擇。 – TonyB 2013-04-29 02:30:57

好的，我自己解決了這個問題，並且會在這裏爲後人記錄解決方案。

我原本以爲有排隊驗證和模糊功能的問題，並試圖解決這個問題。我終於發現，問題是驗證中的遠程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-04 02:57:15 TonyB

jQuery驗證插件和表單字段事件之間的交互

回答

相關問題