Question

I’m using a bit of Mootools to access the values of an HTML select element but the thing is that the way to do it with Mootools [.getSelected()] returns an array and I don’t know how to handle it.

my code :

<script type="text/javascript">
  window.addEvent('domready', function(){
    $('votconj').addEvent('click', function() {
      // This works great 
      $('jj_conjoint').addClass("validate['required']");
      $('mm_conjoint').addClass("validate['required']");
      $('aaaa_conjoint').addClass("validate['required']");
      $('conjoint_regime').addClass("validate['required']");
      new FormCheck('form');
    });
    if ($('nb_children').getSelected() == 1){
     // this doesn't work because .getSelected() returns an array and never equals 1
     $('jj_enfant1').addClass("validate['required']");
     $('mm_enfant1').addClass("validate['required']");
     $('aaaa_enfant1').addClass("validate['required']");
     new FormCheck('form');
    }
    if ($('nb_children').getSelected() == 2){
     // this doesn't work because .getSelected() returns an array and never equals 2 
     $('jj_enfant2').addClass("validate['required']");
     $('mm_enfant2').addClass("validate['required']");
     $('aaaa_enfant2').addClass("validate['required']");
     new FormCheck('form');   
    }

    new FormCheck('form');
}); 

</script>

Answer 1

You can use .each to traverse an array in MooTools:

var selected = $('nb_children').getSelected();

selected.each(function(element) {
  var val = element.get('value');

  $('jj_enfant' + val).addClass("validate['required']");
  //etc
}

new FormCheck('form');

For more info: http://mootools.net/docs/core/Types/Array#Array:each

The reason why getSelected() returns an array at all times, is that code like this can always be reused when you decide to add multiple selectable items instead of just one.

Edit

Note that the above code is directly written. Might need some tweaking to get it working for your case.

Edit 2

Updated code to a more comprehensive example.