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

Question

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

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

Я знаю, что перечисление этого снова и снова для каждой категории - это не способ сделать это. Я думаю, мне нужно создать массив категорий var cats = ['olive oil', "grains", "pasta"] , а затем использовать функцию 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 (нет, я не могу обновить его жаль). Я уверен, что это своего рода базовый, что-то, что, кажется, обволакивает мой мозг. но я совершенно уверен, что делает это, как указано выше, не очень хорошо ...

Answer 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 
     }); 
    }); 
} 

Answer 2

Нечто подобное могло бы помочь:

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