Упорядочение моего javascript с помощью функции

У меня есть серия избранных списков, которые я использую для заполнения текстовых полей идентификаторами. поэтому вы выбираете опцию выбора, а другое текстовое поле заполняется его идентификатором.

только с одной парью select/id это прекрасно работает, но у меня есть множественные числа, и единственное, что меняется, - это идентификатор выбора и ввода. Фактически только конечные изменения, все входы начинаются с featredproductid и выберите ids, все начинают с recipesproduct, а затем оба заканчиваются категорией.

Я знаю, что перечисление этого снова и снова для каждой категории - это не способ сделать это. я думаю, мне нужно создать массив категорий var cats = ['оливковое масло', "зерно", "макароны" ] а затем использовать функцию forEach? может быть?

вот неуклюжий код

window.addEvent('domready', function() {
    $('recipesproductoliveoil').addEvent('change', function(e){
       pidselected = this.options[this.selectedIndex].getProperty('value') ;
   $("featuredproductidoliveoil").setProperties({
       value: pidselected}); ;
    });
       $('recipesproductgrains').addEvent('change', function(e){
           pidselected = this.options[this.selectedIndex].getProperty('value') ;
       $("featuredproductidgrains").setProperties({
           value: pidselected}); ;
        });
      $('recipesproductpasta').addEvent('change', function(e){
          pidselected = this.options[this.selectedIndex].getProperty('value') ;
      $("featuredproductidpasta").setProperties({
          value: pidselected}); ;
       });
    $('recipesproductpantry').addEvent('change', function(e){
        pidselected = this.options[this.selectedIndex].getProperty('value') ;
    $("featuredproductidpantry").setProperties({
        value: pidselected}); ;
     });

});

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

Ответ 1

Ты близко. Вот как вы могли это сделать:

var cats = ['oliveoil', 'grains', 'pasta'];
for (i in cats) {
    addChangeFunction(cats[i]);
}

function addChangeFunction(name) {
    $('recipesproduct' + name).addEvent('change', function(e) {
        pidselected = this.options[this.selectedIndex].getProperty('value');
        $('featuredproductid' + name).setProperties({
            value: pidselected
        });
    });
}

Ответ 2

Что-то вроде этого может помочь:

 function bindSelectFeature(select, featured) {
    $(select).addEvent('change', function(e){
        pidselected = this.options[this.selectedIndex].getProperty('value') ;
        $(featured).setProperties({
          value: pidselected
        });
     });
  });
  bindSelectFeature('recipesproductpasta','featuredproductidpasta');