Javascript for checkbox

[joki94]

Hi at all,

I have an issue regarding javascript for my checkboxes. I have different groups and in each group I have a textfield cancel_days and for all groups together I have one checkbox element with all group options in it.

Now I want that it shows only the coresponding group if checkbox for this group is marked and textfield cancel_days for this group is not empty.

This is my code I added as a Javascript event for change, click and load.

Unfortunatly it proofs only if cancel_days are empty after clicking the corresponding checkbox. So it seems to me that code is correct but doesnt work onload or on a change of other checkbox item.

This is my code:

var div = $('rfp_overviews___welche_messen');
var inputs = div.getElements('input[type=checkbox]');
var cancel_days1 = Fabrik.getBlock('form_14').elements.get('rfp_overviews___cancel_days').getValue();
var cancel_days2 = Fabrik.getBlock('form_14').elements.get('rfp_overviews___cancel_days2').getValue();
var cancel_days3 = Fabrik.getBlock('form_14').elements.get('rfp_overviews___cancel_days3').getValue();
var cancel_days4 = Fabrik.getBlock('form_14').elements.get('rfp_overviews___cancel_days4').getValue();

var fairname1 = Fabrik.getBlock('form_14').elements.get('rfp_overviews___fair_name1').getValue();

for (i=0; i < inputs.length; i++) {

if (inputs.checked && inputs.value == '1' || cancel_days1 !== '' && fairname1 !== 'Keine Messe- und Eventzeiten') {
document.id('group62').show();
}
else if (!inputs.checked && inputs.value == '1') {
document.id('group62').hide();
}
if (inputs.checked && inputs.value == '2' || cancel_days2 !== '') {
document.id('group63').show();
}
else if (!inputs.checked && inputs.value == '2') {
document.id('group63').hide();
}
if (inputs.checked && inputs.value == '3' && cancel_days3 !== '') {
document.id('group64').show();
}
else if (!inputs.checked && inputs.value == '3') {
document.id('group64').hide();
}
if (inputs.checked && inputs.value == '4' && cancel_days4 !== '') {
document.id('group65').show();
}
else if (!inputs.checked && inputs.value == '4') {
document.id('group65').hide();
}
}

In total I have 19 checkbox options but I decided to cut the code here, because it will be the same for every option.

Hope someone understand what I mean and can help me get this working.

Thanks and kind Regards,

joki94

 

[cheesegrits]

Helping with custom JS coding isn't something we usually do in Community support, but here's a hint on the best way ...

Create a ./components/com_fabrik/js/form_X.js file (replace X wiuth numeric id of the form).

function doMyThing(el) {
   // get an array of the checkbox values.  The checkbox values will have to be numbered 1 through 19
   var chx = el.form.formElements.get('rfp_overviews___welche_messen').getValue();

   // loop round 19 times, for each group
   for (x=1; x<= 19; x++) {
      // get the value of this group's cancel_days.  Note that this means naming them from cancel_days1 to cancel_days19
      var cancelEl = el.form.formElements.get('rfp_overviews___cancel_days' + x);

      // get the fabrikGroup wrapper for this group by using closest() on the cancelEl
      var group = jQuery(cancelEl.element).closest('.fabrikGroup');

      // if this 'x' is selected, AND the cancelEl value is not empty, show the group and 'continue' (skip to next iteration of loop)
      if (jQuery.inArray(x.toString(), chx)) {
         if (cancelEl.getValue() !== '') {
            group.show();
            continue;
         }
      }

      // if we got here, then either 'x' wasn't selected in chx, or the cancelEl was empty, so hide the group
      group.hide();
   }
}

Then in the element JS event for elements that you want to trigger this code from, in the "your own ocde" box, put ...

doMyThing(this);

Note that looking at your code, you may need to rename cancel_days to cancel_days1.

-- hugh

 

[joki94]

Hi Cheesegrits, thank you so much. Work like a charm.

Kind Regards, joki94

 

[joki94]

Hi again,

can someone say me how this code will work in details view as well?

I cant get it working.

Kind Regards, joki94