CODEWITHSUNDEEP
eventsevent-handlingjquery
user961627
user961627

Reputation: 12747

two different elements' submit and click events handled by same jquery function?

I have a submit button #next_step and a link #design_next_step.

When the button submitted or the link is clicked, the same function is triggered.

How can I do something like this?

$('#next_step').submit(), $('#design_next_step').click(){function(){ ... });

Upvotes: 5

Views: 3481

Answers (6)

Pbk1303
Pbk1303

Reputation: 3802

May be you can just call it like you would call a normal function.Since in this case submit and click perform the same action ,when the user submits or clicks the link,they call the funcion "myFunction"

                function myFunction()
                      {
                        ..........
                      }
                $('#button').submit(myFunction);
                $('#link').click(myFunction);

or 

                 var myFunction=function()
                    {
                       .......
                    }

                  $('#button').submit(myFunction);
                  $('#link').click(myFunction);

Upvotes: 0

Suresh Atta
Suresh Atta

Reputation: 121998

I guess there is no way to do like that

Instead try to use same function in event handlers 

$('#formId').submit(function{
   execute();
});

 $('#design_next_step').click(function{
 execute();
 })

Upvotes: 0

T.J. Crowder
T.J. Crowder

Reputation: 1074168

You can use the standard CSS comma to define a group selector:

$('#next_step, #design_next_step').on('submit click', function(){ ... });

When the button submitted or the link is clicked...

But buttons aren't submitted, they're clicked. The submit event relates to form elements, not button or input elements. Assuming that the ids you've shown there are for elements that are buttons or links, just use the click event:

$('#next_step, #design_next_step').on('click', function(){ ... });

Depending on what you're doing, you may — or may not — want to prevent the default action for the event [by accepting the event argument and calling preventDefault on it, or by doing return false in the handler which will both prevent the default and stop propagation]. The default action for click on links is to follow the link, for instance.

Upvotes: 6

Jonathan
Jonathan

Reputation: 9151

This would be more appropriate. 

$('.anchor').click(function{
   $('form').submit();
});

Upvotes: 0

Aravind
Aravind

Reputation: 3179

Just make both event handlers to call the same function F.

$('#next_step').submit(function() {
   F();
});
$('#design_next_step').click(function() {
   F();
});
var F=function() {
   . . .Write code here
}

Upvotes: 4

dev2d
dev2d

Reputation: 4262

you can give same class to both, the link as well as the button and then you can try doing following

$('.className').click(function() {
    var item = $(this); // item that triggered the event

});

and if you want to do based in IDs then following

$('#Button1, #Link1').click(function() {
    // You can use `this` to refer to the source element, for instance:
});

Upvotes: 2

Related Questions