Как использовать JQuery проверки с JQuery автозаполнения в моем коде - PullRequest
Новая
       16

Как использовать JQuery проверки с JQuery автозаполнения в моем коде

1 голос
/ 14 сентября 2011

привет, я использую codeigniter.я использую ajax автозаполнение для jquery и плагин проверки jquery

есть поле ввода с именем city 

<input type="text" class="city" name="city" value="">

я использую автозаполнение для этого поля ввода

jquery code 

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

изображение этого

enter image description here

, когда я выбираю значение из выпадающего списка, плагин проверки jquery даетошибка, «минимальная длина 3».но название города больше 3 символов

это мой код подключаемого модуля проверки 

    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"
            },
        }
    });

это ошибка изображения

enter image description here

почему это происходит .Как избежать этого, я устал так тяжело, около недели, чтобы выяснить, что происходит, но не смог.пожалуйста, помогите .......................... большое спасибо.

ОБНОВЛЕНИЕ

это город, штати почтовый индекс HTML.штат и почтовый индекс - это поля рядом с полем города 

                                <div class="input-container">
                                        <div class="catergory-title-c">
                                            <span class="verdana12gray"></span>
                                        </div>
                                        <div class="form-item">
                                            <div class="catergory-inputs-b">
                                                <div class="input-small">
                                                <input
                                                   class="city clear-input"
                                                   id="textarea_small_1"
                                                   value="<?php if(isset($city['value'])){  echo $city['value'] ; }else{echo $map['other']['CityName'];} ?>"
                                                   type="text"
                                                   name="city"
                                               />                       

                                                </div>
                                                <div class="input-small">
                                                        <input
                                                               class="state clear-input"
                                                               id="textarea_small_2"
                                                               value="<?php if(isset($state['value'])){ echo $state['value'] ; } ?>"
                                                               type="text"
                                                               name="state"
                                                           />                                                               

                                                </div>
                                                <div class="input-small">
                                                    <input type="text" id="textarea_small_3" name="zip_code"
                                                        value="<?php if(isset($zip_code['value'])){ echo $zip_code['value'] ; } ?>" />
                                                </div>

                                            </div>
                                        </div>
                                        <div class="clear-fix"></div>
                                    </div>

Ответы [ 2 ]

1 голос
/ 17 сентября 2011

Похоже, ваш валидатор jquery запускается до того, как автозаполнение поместит выбранное значение в поле вашего города - так что в вашем примере "a" (вместо "Кейптаун") получает подтверждение.

Вы можете исправить это, заполнив окно города "быстрее" с помощью обратного вызова onRollover (вместо ожидания выбора пользователем).Я не знаю, какую библиотеку автозаполнения вы используете, но я смотрю на эту http://www.codenothing.com/demos/2009/auto-complete/docs/, и вы сможете сделать что-то вроде этого: 

    jq('.city').autoComplete({
        onRollover: function(event, ui){
            jq('.city').val(ui.data.value)
        }
    });
1 голос
/ 14 сентября 2011

гм, у вас есть дубликат идентификатора В ТАМ: 

 id="textarea_small"

Исправив вышесказанное, вам нужно будет перехватить событие проверки, чтобы оно сработало ПОСЛЕ события выбора - с помощью автозаполнения пользовательского интерфейса jQuery,это довольно просто, т.е. 

...
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;
},
...

Я не знаком с плагином, который вы используете, но он должен иметь что-то подобное.

...