驗證組合框使用jQuery easyui

Question

在我的網頁上，有兩個插件：jquery validate和jquery easyui .. 我使用jQuery驗證驗證DATAS輸入的形式.. 我使用jQuery EasyUI自定義組合框，允許搜索數據在組合框中。

所以，我把驗證插件：

$("#form1").validate({ 
     rules:{ 
      filename:{ 
       required: true, 
       minlength: 3 
      }, 
      leia:{ 
       required: true 
      } 
     } 
    }); 

這是確定！是工作！ 但是，當我把easyUI插件，並設置班級在組合框'萊亞'驗證'leia'沒有更多的工作。

<form id="form1" action="" method="post"> 
     <div> 
       <label>Name:</label> 
       <input type="text" name="filename" /> 
     </div> 
     <div> 
       <label>Leiame:</label> 
       <select name="leia" class="easyui-combobox"> 
         <option value=""></option> 
         <option value="1">Java</option> 
         <option value="2">C</option> 
         <option value="3">C#</option> 
         <option value="4">PHP</option> 
       </select> 
    </div> 

     <input id="submit-go" type="submit" name="add" value="Add" /> 
</form> 

當我在'leia'上課時，驗證工作！ 任何人都可以幫助我嗎？

預先感謝您

Answer 1

所有你需要做的就是讓jQuery驗證對隱藏要素執行。 EasyUI只是隱藏選擇並用自己的元素替換它，但最終會在幕後更新您的選擇。爲了使這項工作：

$("#form").validate({ 
    ignore:'',//by default it ignores hidden inputs, so setting this to blank overrides that 
    rules: {    
     leia: { 
      required: true 
     } 
     }, 
     errorPlacement: function(error,element){ 
     if (element.hasClass('combo-value')){ 
      element.closest("span.combo").after(error); 
     } else { 
      element.after(error); 
    } }  
}); 

我已經添加了errorPlacement功能以及，移動該錯誤信息容易UI標記之外（否則它被埋葬在一個跨度overflow:hidden集）。

看到它在這裏工作：http://jsfiddle.net/ryleyb/B5XX7/2/