Программирование игр, создание игрового движка, OpenGL, DirectX, физика, форум
GameDev.ru / Программирование / Форум / Jquery selector vs elements set

Jquery selector vs elements set

Поделиться
cNoNimУчастникwww28 окт. 20151:11#0
в общем такая ситуация, на форму динамически добавляются некоторые элементы
условно есть кнопка при нажатии нажатии на которую на страницу добавляется допустим dropdown список
при этом по сабмиту необходимо все значения этих списков обработать
и тут есть следующие возможности
1) при создании списка присвоить ему некоторый класс, а при сабмите с помощью jquery по классу собрать все списки и обработать их
2) при создании списка поместить jquery объект создаваемого списка в массив и при сабмите пробежаться по этому массиву
3) точно также как в пункте 2, только использовать не массив, а jquery объект в который черех add добавлять jquery объекты создаваемых списков
и вопрос, что предпотчительней?

2 пункт можно еще модернезировать, при сабмите преобразовать массив в jquery объект

но на самом деле 2 и 3 пункты с различными модернизациями скорее всего сведутся к одному и тому же,
главный вопрос есть ли в принципе смысл создавать подобную коллекцию элементов, или обработать все селектором по классу и не париться?

DiganПостоялецwww28 окт. 201510:39#1
А не проще отказаться от таких извращений с jQuery для таких задач и использовать вместо него биндинги нокаута? Тогда все текущие значения по выбранным элементам в списке всегда можно будет получить просто обратившись к модели.

Правка: 28 окт. 2015 10:42

cNoNimУчастникwww28 окт. 201521:18#2
Digan
я глянул нокаут, я не знаю, смысл в прослойке не очень ясен,
правда есть уверенность, что оно лучше?
или вопрос в удобстве? ну так проблема ведь тоже не совсем в удобстве
FlaПостоялецwww29 окт. 20152:10#3
cNoNim
Собирать данные из верстки - гиблое дело. Так никто не делает уже лет пять, если ты конечно не сайт для ООО "Окна в Реутове" делаешь.
Как уже сказали - knockout. Маленький, локализированный и требует мало кода для топорных задач (в отличие от ангуляров, емберов, бекбоунов и реактов). Обычные селекты из коробки, биндинги для жиквери-юи есть в интернетах.
Ничего не имею против ангуляров, емберов, бекбоунов и реактов, но вводить нокаут на страницу ради небольшой интерактивности в разы проще.

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

Короче, нужно больше конкретики.

DiganПостоялецwww29 окт. 201517:03#4
cNoNim
> я глянул нокаут, я не знаю, смысл в прослойке не очень ясен,
> правда есть уверенность, что оно лучше?
> или вопрос в удобстве? ну так проблема ведь тоже не совсем в удобстве

Удобство в том, что можно отказаться от jquery и кода будет в разы меньше. Следовательно поддерживать его будет легче. Плюс не нужно каждый раз пробегать по странице, чтобы собрать данные. Нокаут сам изменение данных на странице отслеживает и обновляет модель.
Если брать функционал, который ты привел, то вот пример:

html:

<div data-bind='foreach: data'>
    <select data-bind="options: $data.listData, optionsText: 'name', optionsValue: 'id', value: $data.selectedId"></select>
    <br/>
</div>

js:

var DropDownList = function(selectedId, listData) {
   this.selectedId = ko.observable(selectedId);
   this.listData = listData;
};

var lists = [
    new DropDownList(0, [ { name:'France', id: 0 }, { name : 'Germany', id: 1 }, { name: 'Spain', id: 2 }]),
    new DropDownList(0, [ { name:'Male', id: 0 }, { name : 'Female', id: 1 }]),
    new DropDownList(0, [ { name:'Ford', id: 0 }, { name : 'Lexus', id: 1 }, { name: 'Nissan', id: 2 }])
];

var viewModel = {
    data: ko.observableArray(lists)
};
 
ko.applyBindings(viewModel);

Чтобы получить выбранные элементы со всех списков достаточно написать что-то типа такого:

for(var i in viewModel.data()) {
        console.log(viewModel.data()[i].selectedId());
}

Живой пример:
http://jsfiddle.net/55q81jhj/


Дополнительно:

http://knockoutjs.com/documentation/options-binding.html
http://knockoutjs.com/documentation/foreach-binding.html

Правка: 29 окт. 2015 17:07

КрофтикусПостоялецwww21 дек. 201520:36#5
cNoNim
Я бы выбрал вариант 1, он простой и легко модернизируемый.
В общем то, для простого решения таких проблем Jquery и создавался.

По поводу скорости, да, это не очень оптимально. Но это веб, и пользователь эту нагрузку скорее всего даже не заметит, если у вас не миллион таких списков.

Можно вообще не добавлять спискам никаких классов, а просто извлечь все списки у выбранной формы

Правка: 21 дек. 2015 20:41

/ Форум / Программирование игр / Веб

2001—2017 © GameDev.ru — Разработка игр