如何在我的代码中使用jqueryvalidation和jquery自动完成

嗨，我正在使用codeigniter。 我正在使用jjery和jqueryvalidation插件的 ajax 自动完成

有一个叫做城市的输入框

我为此输入框使用自动完成function

jquery代码

  var a = jq('.city').autocomplete({ serviceUrl:"config->item('base_url'); ?>home/auth/city_autocomplete", }); 

这个的形象

当我从下拉列表中选择一个值时，jqueryvalidation插件会给出一个错误，’min length 3’。 但城市名称大于3个字符

这是我的validation插件代码

  var x=jq("#contactinfo").validate({ rules: { city: { required:{ depends: function(){ return ((type == "Single Store & Venue") || (type == "Chain Store & Venue")|| (type == "Department Store")); } }, minlength: 3, maxlength: 50 }, }, messages: { city: { required: "Enter City", minlength: "min length 3" }, } }); 

tihs是错误图像

为什么会发生这种情况。 如何避免这种情况，我厌倦了soooooooooooo努力，大约一个星期来弄清楚发生了什么，但不能。 请帮助……………………..非常感谢你。

UPDATE

这是城市，州和邮政编码html。 state和zipcode是city字段旁边的字段

  
 
  
 
 
 
 <input class="city clear-input" id="textarea_small_1" value="" type="text" name="city" /> 
 
 <input class="state clear-input" id="textarea_small_2" value="" type="text" name="state" /> 
 
 <input type="text" id="textarea_small_3" name="zip_code" value="" /> 
 
 
 
  

Answer 1

看起来你的jqueryvalidation器在自动完成之前启动将所选值放入你的城市框中 – 所以在你的例子中，“a”（而不是“开普敦”）正在得到validation。

您可以通过使用onRollover回调“更快”填充城市框来解决此问题（而不是等待用户进行选择）。 我不知道你正在使用什么样的自动完成库，但我正在看这个http://www.codenothing.com/demos/2009/auto-complete/docs/你应该可以做类似的事情这个：

  jq('.city').autoComplete({ onRollover: function(event, ui){ jq('.city').val(ui.data.value) } }); 

Answer 2

嗯，你有一个重复的ID在那里：

  id="textarea_small" 

修复了上述问题后，您需要拦截validation事件以强制它在选择事件后触发 – 使用jQuery UI自动完成，这很简单，即

 ... select: function(event, ui) { var selectedValue = ui.item.value; var focusedElement = $(this); // my pretend function checkData OR add a validation event fire here. checkData(focusedElement, ui.item, selectedValue); return false; }, ... 

我不熟悉你正在使用的插件，但它应该有类似的东西。