Forums

hello i want to create an conditional form
i create a checkbox group
and container (slider option)
i want to display container if i check an option in checkbox
=> that work on filed becaus we can hidde it
but container doesn't have this option ...
how to ?
reagrds

other question about conditional event
to display field :
if value1 is checked
= value1 show parent id => work
if value is unchecked
=! value1 hidde parent id => doesn't work (field isn't hidden ...)
some idea ?

Hi micker,

Yes - please try changing the options to use something other than 1 and 0 for example:

yes=yes
no=no

I think the 1 and 0 values aren't always read properly in the JavaScript that is created.

Bob

But i already do this
= oxydation visible parent myfield
=! oxydation hidde parent myfield
What is wrong ?

End do you have idea to hide container ? Ex a slider

Hi micker,

Please post a link to the form so I can take a quick look.

Bob

in this url
http://com3elles.us/com3elles.net/universkin/index.php/diagnostic-fonctionnel
i want to display oxydation slider only if oxydation checkbox is used

In your checkbox events, set it to hide element with id = slider_oxydation

Regards,
Max

i try it in above url
= oxydation show parent slider_oxydation
!= oxydation hide parent slider_oxydation
but doesn't work
thanks for helping

No "parent" should be used because you hide this element itself, just "hide" and "show"!

ok its woks if i check an other value but how to hide slider if oxydation isn't checked
thnka

In your checkbox events, add an event when the value != oxydation, and set it to hide the slider!

it's already done => but on initialize form slider is display ... not hide (no value checked on initialize form)
for field we have an option for this => we can hide field at first but not in container ...
an idea ?
thanks for all you reply you are great support !

i add same rule type in all checkbox .. but behavior is strange ...
if you check all => nothing was display
after uncheck oxydation => display is good
if i uncheck other .. that doesn't works ...
i didn't find a way to have good comportement
thanks for your help

somebody can help me ?
regards

Hi micker,

The current version doesn't have an option to hide the container on load, but the next one has, you can send me a message using the "contact us" page to get the next update files or wait a few days.

Regards,
Max

The problem with php to hide an element on load is that if the user does not use javascript it always stays hidden.

Rob

Just noticed that you use javascript to hide elements on load, not php, so it will work ok.

Rob

contact send

i am trying last version but impossible to hide container is option isn't checked ... i dont understand why ...
some idea ?

i recheck all conditions but impossible to hide container when i unchecked radio button ....
somebody have an idea ?

Hi micker,

I used the access that you gave me yesterday and created a solution in jQuery.

I had to remove the sliders and left as div. What I suggest is that you do the same fizes up with "Oxydation" (#Oxydation div > chronoform#slider-container-69 [Jaune]), thus becomes with the same shape of the sliders, because as you can see, is slightly different.

Here is the solution in jQuery(First action on event on load [Load JavaScript]):

jQuery(function () {
 
  jQuery("#div_oxydation").slideUp(500);
  jQuery("#slider_fibroblastes").slideUp(500);
  jQuery("#slider_inflamatoire").slideUp(500);
  jQuery("#slider_barriere_cutanee").slideUp(500);
  jQuery("#slider_keratisation").slideUp(500);
  jQuery("#slider_hyperseborhee").slideUp(500);
  jQuery("#slider_pigmentaire").slideUp(500);
  jQuery("#slider_flore").slideUp(500);

  
jQuery("input[type='checkbox']").prop('checked',false);

   jQuery("input[type='checkbox']").change(function () {
   if(this.checked)
switch (this.value) {
    case "oxydation":
 jQuery("#div_oxydation").slideDown(800);
	break;
    case "trouble-extracellulaire":
  jQuery("#slider_fibroblastes").slideDown(800);
	break;
    case "inflammation":
  jQuery("#slider_inflamatoire").slideDown(800);
	break;
    case "trouble-barriere-cutanee":
  jQuery("#slider_barriere_cutanee").slideDown(800);
	break;
    case "trouble-keratinisation":
  jQuery("#slider_keratisation").slideDown(800);
	break;
    case "hyper-seborrhee":
  jQuery("#slider_hyperseborhee").slideDown(800);
	break;
    case "trouble-pigmentation":
  jQuery("#slider_pigmentaire").slideDown(800);
	break;
    case "trouble-flore-cutanee":
  jQuery("#slider_flore").slideDown(800);
	break;
	default:
	 jQuery("#div_oxydation").slideUp(500);
  jQuery("#slider_fibroblastes").slideUp(500);
  jQuery("#slider_inflamatoire").slideUp(500);
  jQuery("#slider_barriere_cutanee").slideUp(500);
  jQuery("#slider_keratisation").slideUp(500);
  jQuery("#slider_hyperseborhee").slideUp(500);
  jQuery("#slider_pigmentaire").slideUp(500);
  jQuery("#slider_flore").slideUp(500);
}
else
switch (this.value) {
    case "oxydation":
  jQuery("#div_oxydation").slideUp(500);
	break;
    case "trouble-extracellulaire":
  jQuery("#slider_fibroblastes").slideUp(500);
	break;
    case "inflammation":
  jQuery("#slider_inflamatoire").slideUp(500);
	break;
    case "trouble-barriere-cutanee":
  jQuery("#slider_barriere_cutanee").slideUp(500);
	break;
    case "trouble-keratinisation":
  jQuery("#slider_keratisation").slideUp(500);
	break;
    case "hyper-seborrhee":
  jQuery("#slider_hyperseborhee").slideUp(500);
	break;
    case "trouble-pigmentation":
  jQuery("#slider_pigmentaire").slideUp(500);
	break;
    case "trouble-flore-cutanee":
  jQuery("#slider_flore").slideUp(500);
	break;
	default:
	 jQuery("#div_oxydation").slideUp(500);
  jQuery("#slider_fibroblastes").slideUp(500);
  jQuery("#slider_inflamatoire").slideUp(500);
  jQuery("#slider_barriere_cutanee").slideUp(500);
  jQuery("#slider_keratisation").slideUp(500);
  jQuery("#slider_hyperseborhee").slideUp(500);
  jQuery("#slider_pigmentaire").slideUp(500);
  jQuery("#slider_flore").slideUp(500);
}
  });
});

Cya
BN

Translation problem, sorry:

...What I suggest is that you do the same fizes up with "Oxydation"...

What I suggest is that you do the same you do with the "Oxydation"

I also change the condtions, I set enable/disable instead of show / hide not to create conflicts with the code.

Cya,
BN

Hi,

Just a note here, the latest update had a bug in "radio buttons" events, so they may not work correctly.

Regards,
Max

Hi micker,

Please post a link to the form so I can take a quick look.

Bob

Hi Max,

It's not radio buttons, it's check box.

I don't know if is a bug or not, I never had to use condictions on CF, but I had already needed something like in Seblod, so I just adapt a litle my code, and it works fine.

I could even say it is failing to compare strings, but it recognizes when the checkbox is checked, then the problem is not in comparison. It simply does not react when the uncheck happen.

But, this worked from him. but still, I wonder why it did not work.

The conditions seemed right:

If fieldA == XXX shows sliderXXX
If fieldA! = XXX hides sliderXXX

Had these conditions for each value of checkboxes.

One thing I was thinking later, is that the sliders were not inside a SlidersArea, could this be the problem?

BN