Add a button to a form

Hi there,
I have a form to which I need to add a command button which takes the selections that the user has made and calculates the total cost using some javascript. I can of course add this button to the html manually, but when I make changes to the form using the wizard it is overwritten.

Is there a way that I can overcome this problem, so that the button is retained regardless of how the form is edited?
Many thanks
Paul

OK, I've got it now - by changing the form type to custom in the source viewer.

Now another questions:

I've some JS functions defined in the on load section of the form. I can see the functions in Firebug.

Here is the button definition from whence I'm attempting to call the code:

<input name="buttonCalcFee" class="" value="Calculate Fee" type="button"
onClick="calculate_fee('CR12TGP',getCheckedValue(document.chronoform_MyFormNameIsHere.elements['regMember']);"/>

In Firebug I've set breakpoints on both calculate_fee and getCheckedValue but neither of the functions seem to be called. Is there something I'm missing here?

Thanks
Paul

Hi Paul,

The 'preferred' way to add custom elements like a button is to use the 'Custom Element' element. You can use that AND still use the Wizard.

I'd add code by adding an id="buttonCalcFee" to the button and using the Load JS action

window.addEvent('domready', function() {
  $('buttonCalcFee').addEvent('click', function() {
    // this line could probably be rewritten using $$
    var val = getCheckedValue(document.chronoform_MyFormNameIsHere.elements['regMember'];
    calculate_fee('CR12TGP',val);
  });
});

If the functions aren't being called then you need to check for JavaScript errors using the web developer tools in your preferred browser.

Bob

Thanks Bob,
Should I add the code you've give in the Load JS, or in the code section of the custom element?
Thanks
Paul

Hi Paul,

I'd use the Load JS action for any JavaScript snippets like this.

Bob

OK got it, thanks.

I've just ont small problem, and it is a js problem it seems. This line

var retvar = getCheckedValue(document.chronoforms_myFormName.elements['regElement']);

doesn't seem to like

document.chronoforms_myFormName.elements['regElement']

Is [ document.chronoforms_ ] the correct prefix for forms in this version of chronoforms? I can see that form name in html, and I can also see the element with that ID. But the script fails on that line. I've test getCheckedValue by passing a value to it and it worked fine so that isn't the problem.

Thank again,
Paul

OK sorted.

Needed to have a look at mootools documentation as well as js.
Thanks for your help Bob.
Best,
Paul