jQuery: как сбросить несколько выпадающих списков после того, как они были клонированы?

#javascript #jquery #drop-down-menu #clone #dynamic-forms

#javascript #jquery #выпадающее меню #клонировать #dynamic-forms

Вопрос:

На данный момент мой код клонирует 3 выпадающих списка каждый раз, когда вы нажимаете кнопку добавить.

Мне удалось заставить его скопировать строку точно, потому что раньше первый выпадающий список сбрасывался сам по себе, а два других — нет, поэтому мне просто интересно, как сбросить все 3 выпадающих списка?

Это проще всего увидеть в этом JSFiddle:

http://jsfiddle.net/jydqK/7/

Итак, если вы измените первый выпадающий список на agent , а затем нажмете , вы увидите, что вторая строка выглядит дублированной, тогда как я бы хотел, чтобы она была сброшена на tags , operands и values .

Любая помощь приветствуется.

Ответ №1:

Вы можете использовать removeAttr для удаления selected атрибута, а затем запустить событие change().

В вашем случае:

 dropdownclone.find('select.tags option:selected').removeAttr('selected');
dropdownclone.find('select.tags option:first').attr('selected','selected');
dropdownclone.find('select.tags').trigger('change');
  

Измененный пример: http://jsfiddle.net/ZF3mc/2

Ответ №2:

Если я понял ваш вопрос, вы хотите, чтобы дублированная строка select сбросила свои значения.

В этом случае вы можете просто удалить это:

 dropdownclone.find('select').each(function(index, item) {
 //set new select to value of old select
$(item).val( $dropdownSelects.eq(index).val() );
});
  

и заменить его на:

 dropdownclone.find('option').attr('selected', false);
  

Ответ №3:

Найдите все выпадающие списки в вашем клоне. Для каждого выпадающего списка проверьте все теги опций для выбранного атрибута и удалите его. Что-то вроде этого:

 clone.find('select').each(function() {
    $(this).find('option').each(function() {
        $(this).removeAttr('selected');
    });
});
  

Или, что еще лучше, найдите только выбранные теги опций с помощью :selected filter перед удалением.