Hide/show element in repeat group

[Virginie84]

Hi,

I would like to use inline javascript code with repeat group.
I have a radibutton with 2 choices and a lot of fields that I want show or hide.

I have look at html code and I have seen that each fields of repeat group have an id of this type: table_name___element_name_numberRepeat.
So first I try to hide my first field of my first group
I edit radiobutton and in javascript editor I add my code for change() event.
and It works fine for my first group but my field in second group is hidden too.

My code is:

function recuperChecked(){
      var valueRad = '';
 
    for(i=0; i<2;i++){
      var radioButton= document.getElementsByName('doss_associes___AssIdentite[0][]');
      
      if(radioButton[i].checked){
        valueRad = radioButton[i].value;
      }
    }
    return valueRad;
  }

var val = recuperChecked();

var element1= document.getElementById('doss_associes___AssCivilite_0');

if (val == '1')
{
    element1.show();
}
else if(val == '0')
{
  element1.hide();
}

Why my doss_associes___AssCivilite_1 is hidden too ?
Do you know how I can solve that ? Becaus my group is a datajoin group and I can't divided this group in subgroup.


Thank you

 

[cheesegrits]

In your JS events for the radio button, onClick, add the code:

recuperChecked(this);

Then create the file ./components/com_fabrik/js/form_X.js, replacing X with the numeric ID of your form. In that file, put this ...

function recuperChecked(el) {
   // get the clicked element's value
   var val = el.getValue();
   // get the repeat number of the clicked element
   var repeat = el.getRepeatNum();

   // now hide / show your elements, using the repeat count appended to their base name
   if(val =='1') {
      el.form.formElements.get('doss_associes___AssCivilite_' + repeat).show();
   }
   else if(val =='0') {
      el.form.formElements.get('doss_associes___AssCivilite_' + repeat).show();
   }
}

-- hugh