CODEWITHSUNDEEP
javascriptjquery
Burlyn84
Burlyn84

Reputation: 94

jQuery button one click two functions

I have a webform that I would like to submit on a PayPal button click.

I have been able to get one or the other to work but not both. So the Paypal button is to submit the form and then load the payment page. This code only submits the form and doesn't load the payment page. 

$('#block-paypalblock input[type="image"]').click(function() {
    $('#edit-actions input#edit-actions-submit').click();
})

This code only loads the payment page:

$('#block-paypalblock input[type="image"]').click(function() {
    $('#edit-actions input#edit-actions-submit').click();
    $(this).click();
})

What am I missing? Do I need a third button that would handle both the other buttons?

<form class="webform-submission-form webform-submission-add-form webform-submission-purchase-1-2-3-form webform-submission-purchase-1-2-3-add-form js-webform-details-toggle webform-details-toggle contextual-region" data-drupal-selector="webform-submission-purchase-1-2-3-add-form" action="/form/purchase-1-2-3" method="post" id="webform-submission-purchase-1-2-3-add-form" accept-charset="UTF-8" data-drupal-form-fields="edit-first-name,edit-actions-submit">

Upvotes: 0

Views: 180

Answers (2)

Jordi Castillo
Jordi Castillo

Reputation: 693

The best way to do this is put name for two functions:

function myfunction1 () {
    myelement1 = $('#element1')
    //work with element 1
});

function myfunction2 () {
    myelement2 = $('#element2')
    //work with element 2
});

Then just call when you want

$(mytrigger).click(function () {
    function1();
    function2();
});

Upvotes: 1

NickAndrews
NickAndrews

Reputation: 496

I think your selector is bad, trying to click both buttons with a single selector isn't working for me, this does work though.

$(function () {
    $('.test').click(function () {
        $('#edit-actions').click();
        $('input#edit-actions-submit').click();
    });

    $('#edit-actions').click(function () {
        console.log('#edit-actions', 'clicked');
    });

    $('input#edit-actions-submit').click(function () {
        console.log('#edit-actions-submit', 'clicked');
    });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button type="button" class="test">click me</button>
<input type="button" id="edit-actions" value="button1" />
<input type="button" id="edit-actions-submit" value="button2" />

Upvotes: 1

Related Questions