Run Javascript Before Click "submit My Order" Button

Hi all,

I am currently having problems. I want to add my javascript in checkout page so that when i click “Submit my order” button it run my javascript first and then it submit my order. I create my own tpl file from “cc.tpl” and link “processor_template” to this. i add my javascript in this tpl file and it work right when i first use but when i choose different “billing option” and chose back again, it don't work anymore.

I use
$('.cm-checkout-place-order').click(function(event) {})
to catch this click event.

i wonder if i do something wrong, can you can give me some help about this.

Thank you in advance!

Please add the class=“cm-ajax-force” to the script tag:

From docs:

cm-ajax-force - allows to execute js code from the ajax response for the second time. It should be used together with cm-ajax.

Just make sure your function for the event returns true so that the actual form submission (that's where ajax comes into play). If it returns false or undefined, the actual submit may never occur.

You should probably have this triggering on the ID of the button versus a class since that could be ambiguous.

Thanks eComLabs, that worked perfectly.

Hi tbirnseth,

I view the code of “Submit my order” button and this has id “place_order_tab1”. I don’t know wheather i should use it to catch the event when i click this button.

<br />
<button id="place_order_tab1" class="ty-btn__big ty-btn__primary cm-checkout-place-order ty-btn" name="dispatch[checkout.place_order]" type="submit">Submit my order</button><br />

```<br />
<br />
I see CS-Cart have JavaScipt Hooks for add-on. Can i use it to catch the event before i submit the checkout form?<br />
<br />
Thank you for your help. <img src="upload://j4344XCUSyS3NqDPu7p7k9bszEw.gif" class="bbc_emoticon" alt=":rolleyes:">

You can use a jQuery click event set for “#place_order_tab1” (or shorthand of your choosing) in a “checkout:step_four_edit_link_title” hook but make sure you do a delayed binding via $(document).ready() so the element will be loaded when you try to bind the click event. The element is loaded after this hook would be called. You can use any hook that is loaded to get to this page since you will be late binding.