CODEWITHSUNDEEP
javascriptjqueryhtmlforms
pes502
pes502

Reputation: 1587

jQuery multiple firing submit form event (I think)

I have got this form:

<li class="easyad_form_li">Pro tento článek ještě lze zakoupit reklamu - <a class="easyad_showform_link" onclick="$(\'#easyad_gateway_form\').toggle(\'normal\')">zobrazit formulář pro nákup</a>
<form id="easyad_gateway_form" action="' . EASYAD_GATEWAY_LINK . '?a=checkout" METHOD="POST">
   <label for="easyad_gateway_link">Odkaz:</label> <input type="text" name="easyad_gateway_link" value="http://">* <i>(uveďte včetně http://)</i><br />
   <label for="easyad_gateway_link_name">Název: </label> <input type="text" name="easyad_gateway_link_name">* <i>(bude zobrazeno jako klikatelný odkaz)</i><br />
   <label for="easyad_gateway_desc">Popisek:</label> <input type="text" name="easyad_gateway_desc">* <i>(bude zobrazeno za odkazem, neklikatelné)</i><br />
   <span class="easyad_box_req">Pole označená hvězdičkou je nutné vyplnit!</span><br />
   <input type="hidden" name="id_post" id="id_post" value="' . get_the_ID() . '">
   <input type="submit" name="wd_submit" id="wd_submit" class="button action" value="Zaplatit WD">
   <input type="image" name="paypal_submit" id="paypal_submit"  src="https://www.paypal.com/en_US/i/btn/btn_dg_pay_w_paypal.gif" border="0" align="top" alt="Pay with PayPal" />
</form>

If you click on PayPal button as first, form working normally. And if you click on second button (submit - #wd_submit) its working normally too. But if you click on submit button and then on PayPal button, it show 2 new window (1st with PayPal data and 2nd blank).

I think, that problem may be in my jQuery code (I am unskilled in jQuery).

Here is the code:

$('#wd_submit').click(function (event){
    $('#easyad_gateway_form').submit(function(event) {
        window.open('', 'formpopup', 'width=292,height=365,scrollbars=no');
        this.target = 'formpopup';              
    });  
});

Thanks for all tips, tricks and help posts :)

Upvotes: 1

Views: 103

Answers (1)

Arun P Johny
Arun P Johny

Reputation: 388316

There is no need for the click handler, since the wd_submit button is of type submit it will trigger the form submit event, you can just listen to that

$('#easyad_gateway_form').submit(function (event) {
    window.open('', 'formpopup', 'width=292,height=365,scrollbars=no');
    this.target = 'formpopup';
});

In your case whenever the user click on the button a new submit handler is getting registered, so when the user clicks the first time there is one handler but when he clicks again there are 2 handlers added now and both of the will get triggered

Adding a event handler inside another one is always dangerous and you have to be very careful with that.

Upvotes: 2

Related Questions