JQuery Data Link не обрабатывает списки выбора - PullRequest
Новая
       14

JQuery Data Link не обрабатывает списки выбора

1 голос
/ 16 февраля 2011

У меня есть простая форма адреса, использующая потрясающий новый плагин Data Link.Это простой сценарий создания / редактирования, который выполняет ajax-вызов для заполнения формы, если присутствует идентификатор, или пустой формы, если нет. 

dataComplete : function(data){
        $self.step1Data = data;
        $self.Templates.step1('#step1form', $self.step1Data);
        $('#step1form').link($self.step1Data);
    }

Вышеупомянутая функция вызывается в любом случае, чтобы связатьФорма для объекта step1Data (я просто передаю ему пустой объект JavaScript, если у меня нет ничего, чтобы заполнить форму).Объект 'Templates', который вы видите выше, представляет собой простую оболочку, которая использует также потрясающий плагин jQuery Templates.

Это работает great при редактировании;.link () идеально соответствует форме, и все в порядке.Проблема возникает при работе с пустой формой: каждое поле, кроме списка выбора состояния, связано. Вот HTML-код для списка выбора: 

<select class="state" id="State" name="State">
    <option value="UT">Utah</option>
</select>

Соглашения об именах классов и идентификаторовидентичны другим частям формы, но Data Link, похоже, не замечает этого сама по себе.Возможно, я мог бы настроить его так, чтобы это делалось вручную, но для чистоты я предпочел бы не делать этого, если мне это сойдет с рук. Есть идеи, почему он не связывает список выбора?

1 Ответ

0 голосов
/ 16 февраля 2011

Ладно, разобрался.Согласно этой очень подробной статье Шалька, при связывании пустой формы с объектом с помощью Data Link документация подразумевает не совсем точное поведение.

По сути, Data Link только устанавливаетссылка и события для создания свойств внутри объекта; фактически не выполняет двустороннюю синхронизацию между ними до тех пор, пока событие изменения *1007* не сработает .Другими словами, до тех пор, пока пользователь фактически не введет что-либо в поле формы.

Такое поведение подходит для большинства элементов управления (и по возможным причинам производительности имеет смысл ожидать ввода данных пользователем). Проблема в том, что текущая документация подразумевает иное .Имея это в виду, я просто вызвал событие изменения для списков выбора в форме после вызова .link () следующим образом: 

    dataComplete : function(data){
        $self.step1Data = data;
        $self.Templates.step1('#step1form', $self.step1Data);
        $('#step1form').link($self.step1Data);

        //trigger the select lists
        $('[name=State]').trigger('change');
        $('[name=Type]').trigger('change');
    }

Вы также можете просто перебрать поля ввода в форме ивызвать все их события изменения, если это необходимо.Ниже приведен один из способов, я уверен, что есть лучшие методы (здесь обход DOM form -> ul -> li -> inputs ). 

    $('.stepForm').children().children('input').trigger('change')
...