Hello all.
I am wondering if you can help me out.
I have tried searching for something on this to no avail.
I have a form where I have loaded JS before the HTML load with the following:
In my form, I have Containers set to "DIV" and hidden with the name as above in the function.
In a radio box, under events, I have tried to get it to run the above function to no avail.
I have tried:
I have also tried:
What I would love to do is have a set of radio buttons (6) to correlate to the above sections.
If I choose any of the radio buttons, call the function ht() and then show() the appropriate DIV.
Am I doing something completely stupid here?
I have been away from Chronoforms for a while but am loving the new version.
Wow.
I am wondering if you can help me out.
I have tried searching for something on this to no avail.
I have a form where I have loaded JS before the HTML load with the following:
window.addEvent('domready', function() {
function ht() {
jQuery( '#youthwithlessons' ).hide();
jQuery( '#youthwitnnolessons' ).hide();
jQuery( '#familywithlessons' ).hide();
jQuery( '#familywithnolessons' ).hide();
jQuery( '#2pfamilywithlessons' ).hide();
jQuery( '#2pfamilywithnolessons' ).hide();
}
});
In my form, I have Containers set to "DIV" and hidden with the name as above in the function.
In a radio box, under events, I have tried to get it to run the above function to no avail.
I have tried:
=
1
function
ht
I have also tried:
=
1
function
ht()
What I would love to do is have a set of radio buttons (6) to correlate to the above sections.
If I choose any of the radio buttons, call the function ht() and then show() the appropriate DIV.
Am I doing something completely stupid here?
I have been away from Chronoforms for a while but am loving the new version.
Wow.
Hi dogfishent,
I think that you just need to set the function name in the function box e.g. ht - but the function needs to be in the root i.e without the window.addEvent('domready', function() {}); wrapping it.
That said, if you are OK with jQuery then it might be simpler to script this in a Load JS action rather than use the Event code.
Bob
I think that you just need to set the function name in the function box e.g. ht - but the function needs to be in the root i.e without the window.addEvent('domready', function() {}); wrapping it.
That said, if you are OK with jQuery then it might be simpler to script this in a Load JS action rather than use the Event code.
Bob
Sorry GreyHead,
Maybe I am not understanding...
I have the above code in a load JS action before the load HTML action on the farm.
Are you suggesting removing it from the addevent function?
I do have ht in the function area of the event of the radio box.
Is there a different load JS Action section that I am missing?
Thanks for the pointers
Maybe I am not understanding...
I have the above code in a load JS action before the load HTML action on the farm.
Are you suggesting removing it from the addevent function?
I do have ht in the function area of the event of the radio box.
Is there a different load JS Action section that I am missing?
Thanks for the pointers
Bob is suggesting to use the function directly, outside the document ready event:
Regards,
Max
function ht() {
jQuery( '#youthwithlessons' ).hide();
jQuery( '#youthwitnnolessons' ).hide();
jQuery( '#familywithlessons' ).hide();
jQuery( '#familywithnolessons' ).hide();
jQuery( '#2pfamilywithlessons' ).hide();
jQuery( '#2pfamilywithnolessons' ).hide();
}
Regards,
Max
Interesting....
I have added it as above.
I have also added the following.
Here is where things get a little weird.
I have a radio button.
if 1 then call youthwithlessons
if 0 then call youthwithnolessons.
My way of thinking is that it should hid all divs within the ht() function and show the proper div.
BUT when I view the script through web developer in Firefox, the function itself is not available to run?
Do I need different syntax to load a function?
I have added it as above.
function ht() {
jQuery( '#youthwithlessons' ).hide();
jQuery( '#youthwitnnolessons' ).hide();
jQuery( '#familywithlessons' ).hide();
jQuery( '#familywithnolessons' ).hide();
jQuery( '#2pfamilywithlessons' ).hide();
jQuery( '#2pfamilywithnolessons' ).hide();
}
I have also added the following.
function youthwitnnolessons() {
ht();
$( '#youthwitnnolessons' ).show();
};
function youthwithlessons() {
ht();
$( '#youthwithlessons' ).show();
};
Here is where things get a little weird.
I have a radio button.
if 1 then call youthwithlessons
if 0 then call youthwithnolessons.
My way of thinking is that it should hid all divs within the ht() function and show the proper div.
BUT when I view the script through web developer in Firefox, the function itself is not available to run?
Do I need different syntax to load a function?
By the way, can I load a picture up of the script view in Firefox somehow to show the above?
Using the code in the first box, and when you have "ht" in the function name box under the "events", the function should run when the event is triggered.
So I think something must be up with the way that the code is loading then.
I am going to send you a quick PM as I can put alink to the clip I took of it.
Let me know your thoughts?
Thanks so much for your help on this.
I am going to send you a quick PM as I can put alink to the clip I took of it.
Let me know your thoughts?
Thanks so much for your help on this.
Ok, I have tried this a lot of different ways and it just seems that calling a js function is NOT working on this site.
I even tried just a small one like
It simply will not call from the event area for me.
Likely a template issue?
This is a gantry enabled theme.
I would happily allow someone admin access to have a look if they had the time.
http://www.woodcrestpool.ca/index.php?option=com_chronoforms5&chronoform=mem
The first radio group - No should show a div, Yes, should show another div and maybe show hide both of the divs.
Thanks much.
I even tried just a small one like
function hiDon() {
alert('Hi there')l
}
It simply will not call from the event area for me.
Likely a template issue?
This is a gantry enabled theme.
I would happily allow someone admin access to have a look if they had the time.
http://www.woodcrestpool.ca/index.php?option=com_chronoforms5&chronoform=mem
The first radio group - No should show a div, Yes, should show another div and maybe show hide both of the divs.
Thanks much.
edit:
function hiDon() {
alert('Hi there');
}
I figured it out! 😀
Instead of using JQuery (which seemed to be blowing up)
I went with css.
works a charm now🙂
Thanks for the tips today.
Once I mulled your suggestions over a bit it came out in the end.
Cheerio
Instead of using JQuery (which seemed to be blowing up)
I went with css.
function ht() {
document.getElementById("youthwithlessons").style.display="none";
document.getElementById("youthwithnolessons").style.display="none";
document.getElementById("familywithlessons").style.display="none";
document.getElementById("familywithnolessons").style.display="none";
document.getElementById("2pfamilywithlessons").style.display="none";
document.getElementById("2pfamilywithnolessons").style.display="none";
}
function youthwitnnolessons() {
ht();
document.getElementById("youthwithlessons").style.display="block";
}
function youthwithlessons() {
ht();
document.getElementById("youthwithnolessons").style.display="block";
}
works a charm now🙂
Thanks for the tips today.
Once I mulled your suggestions over a bit it came out in the end.
Cheerio
This topic is locked and no more replies can be posted.