Forums

Enabling javascript function in ChronoForms

bmheck 21 Dec, 2008
Sorry if this has been answered already, but I could not find it in the forum:

I have a working HTML form that I've moved into ChronoForms, and have one problem. The form uses a javascript function to populate several variables based on one user choice. It's a membership: if the user chooses a certain membership type, we populate the membership type code, membership type name, and the cost of the membership. For example, if the user chooses "basic membership," we populate a type code like "0001", a type name of "basic", and the cost ($30). All of these variables end up being passed to the payment processor.

The form uses radio buttons for the membership choice.

In the existing HTML form (not in ChronoForms), we do the following:

At the top of the HTML page, we define the function GetSelectedItem() like this:

<script language="javascript">
function GetSelectedItem() {

chosen = ""
len = document.membership.os0.length

for (i = 0; i <len; i++) {
if (document.membership.os0[i].checked) {
chosen = document.membership.os0[i].value
}
}

if (chosen == "individual") {
document.membership.amount.value = 30.00;
document.membership.item_number.value = 1234;
document.membership.item_name.value = "Basic Individual";
}

....etc. (IF statements for several different membership types)

The in the form, we call the function when the button is clicked like this:

<button name="submit" value="submit" type="submit" border="0" onClick =GetSelectedItem() width="87" height="23">Join Us!</button>

The question is how to translate this functionality to ChronoForms. I put the form (including the button definition above and removing the "form" tags) in the Form Code/Form HTML area, and put the javascript function definition (removing the script tags) in the Form Code /Form JavaScript area. I've tried a couple of different combinations in the General / Form Tag Attachment field, e.g., "onClick=GetSelectedItem()" and "onSubmit=GetSelectedItem()" but don't really know what exactly should go there.

The problem is that in ChronoForms, the form works but the function never gets called. I can see that ChronoForms is picking up the correct radio button choice, but the content of the variables does not change.

I'm not really knowledgeable about javascript or PHP (someone else coded the JS function for us), so very explicit directions would be most appreciated!

I can send all of the function and form code if needed.

Thanks!
GreyHead 21 Dec, 2008
Hi bmheck,

It's in the forums at least a dozen times - though probably not recently, and I think there's a FAQ too.

ChronoForms changes the form name so you'll need to amend your JavaScript to use the changed name. If you check the form id in the source you will find it is something like 'ChronoContact_membership' instead of 'membership'.

I can give you more explicit instructions in the morning if you need them.

Bob
bmheck 22 Dec, 2008
Bob,

Thanks! That put me on the right track. If fixed the form name references in the JS code and it's working now.

By the way, although this issue has been addressed previously, it's a bit difficult to track it down. The FAQ on using JS does not mention the need to change the form name reference in the JS code at all. The FAQ does refer to a tutorial, which in turn does say that the form name in the JS must be the same as the form name entered on the General page -- but the tutorial does not say that "ChronoContact_" is entered in front of the form name. (The sample code in the tutorial does show the prefix, though.) Meanwhile, the name issue is addressed in some forum entries, but it's pretty hard to search the forum for the right entries until you know that the issue is related to the form name -- and of course you don't know that until you know what the problem is! So it might help others avoid my mistakes if the FAQ on using JS mentioned the name prefix.

Bill
GreyHead 22 Dec, 2008
Hi Bill,

Apologies for the grumpy message, it was the end of a long day.

I've updated the FAQ. They are a bit old now and some vital parts got lost in the switch to the ChronoConnectivity based system.

Bob
bmheck 22 Dec, 2008
Bob,

Hey, no problem. That updated FAQ entry looks really helpful!

Bill
This topic is locked and no more replies can be posted.