Forums

Hi,
I may be incorrect but I think this is a bug. I have created a form with two dropdowns. The first dropdown should hide the second dropdown when a certain value is selected.

The output from the first dropdown when viewing the sourcecode looks like this:

data-events="[{"sign":"=","value":"Literacy","action":"hide","identifier":"issuename"}]"

Is this correct? The hide is not working so I presume there is an issue somewhere.

Kind Regards

Hi,
I was wondering whether this was a bug? As I can't seem to get this to work?

Should:
data-events="[{"sign":"=","value":"Literacy","action":"hide","identifier":"issuename"}]"

Look like:
data-events="[{'sign':'=','value':'Literacy','action':'hide','identifier':'issuename'}]"

Kind Regards

Hi ctrlmedia,

It should work, how do you view the output ?

Best regards,
Max

Hi Max,
In Firefox I highlight the area of the page I want to see and then right click and go to View Selection Source.
Regards

Hi Max,

I have attached screenshots to show the connection.

First the dropdown field event which says when value is selected hide element id.(issuename)

The next shows my custom dropdown which has the id "issuename"

When I select the Value it does nothing - doesn't hide the element "issuename".


Looking at the browser console, no errors show up just "function fix, jquery.min.js line 3" when I click the correct value.


Regards
Mark

Hi,
I have tried to do this on a completely new connection to see if there was anything conflicting but it still doesn't work.

Maybe its just something simple I have missed, like I need to add something to the view/event which I have missed?
Is there an example built in with this function working? I have looked through but didn't see anything.

Is it worth me writing my own function in jQuery?

Kind Regards

Hi Mark,

Please send me a message using the "Contact us" page and I will send you a patch file to apply.

Alternatively you may create your fields in a Chronoforms 6 section and call the section in the Connectivity form view:
{chronoform/section:form_name/section_name}

Just make sure that you have the latest update for both of them.

Best regards,
Max

Hi Max,
Thanks for that. I have messaged you.

I would like to try both methods so that I can see which is best for me but I'm not sure what the Chronoforms 6 sections are. Is there a guide? or example?

Regards
Mark

Hi Max,
I have tried the patch but it doesn't seem to do anything.
I will in the meantime try and work out the other method.
Kind Regards

Hi Max,
I have also installed CFv6 and created a replica of the form which I have included in to CCv6 as described above.
The hiding of the field still does not work.

I have attached an image to show the workings. On the top dropdown, if Literacy is selected it should hide the dropdown below with an ID of select8.

I have also tried to preview the form in CFv6 rather than in my connection and the hide event doesn't work.
Any help would be much appreciated.

Kind Regards

Hi Max,
Thanks for your help.
That did seem to solve the issue for both methods but not when using a custom input/dropdown for some reason?

In the end I wrote some jQuery to hide and show elements based on the value of the first dropdown.

In CFv6 how do you set the initial "Load State" of the input parent like you could in CFv5?

Kind Regards

Hi Mark,

What's the code you used for the custom input ? when you hide/show in v6, the parent div is actually hidden, so if your input does not have that div then it will not work.

Best regards,
Max

Hi Max,
You may be correct, I did not include a parent in my code as I thought that the custom element did this?
I have removed the code now I'm afraid but it was just a copy of the rendered dropdown to begin with.
Using CFv6 method has worked fine for me now as I have used non custom dropdowns anyway.

Is there a "Load State" in CFv6 like there was in CFv5? I would like to set them to have a hidden state on load? I couldn't see this option in the CCv6 fields either?

Regards

Hi Mark,

#1- You are correct, it should work if the field is enclosed in a div with class = "field", do you have another field with the same id on the page ?

#2- There is no "load state", but the events run on load, so if you have a matching condition on form load to hide some field then it will work.

Best regards,
Max

Hi Max,

No I don't think there was another ID the same. I think it might have been the missing parent as you described but as I have removed that form for the CFv6 form I cannot be sure.

Sorry, I'm a little confused with this.
At the minute I have a series of dropdowns that hide when my jQuery kicks in - I can see them for a split second. I don't want to see them at all, I want them to be hidden as default.

The "load state" option from CFv5 used to do this - hide (display:none) as default so they didn't hide after a second.

Will an event that runs on load do this?

Thanks again.
Kind Regards

Hi Max,

I have solved this, I don't want to take up any more of your time on this.

In the end I just added a class which hides them by default and then used jquery to toggle the class based on the change and value of a dropdown.

I imagine there is a way to do this built in with CFv6 and CCv6 (like the "load State") so that the dropdowns don't appear on load and then remove after a second but the jQuery/CSS solution is working for me.

Thanks again for your help.
Kind Regards

Hi Mark,

I have added this to the next update.

Best regards,
Max