Pass input parameter to .click event

Question

I have a function as follows:

      $("#submitBtn").on('click', function () {
          ....
      });

I am using the following in invoke the click it in a portion of code by doing:

     $('#submitBtn').click();

Is there a way to set a input parameter to the click. For example, I need to pass a string value to the click so that the function can take appropriate steps. Note that the value of p is not from any element from the page. It is something I will be pro-grammatically setting based on some conditions.

     var p = 'sourceinfo';

     $('#submitBtn').click(p);

While it's possible to add data to the event (using this method signature of click), it's generally considered better practice to read the information required from within the click handler itself. — Rory McCrossan
– Rory McCrossan, Commented Oct 16, 2019 at 16:38
On the case you proposed you don't actually need to send any parameters to your event. You just need to use a global variable and access it on your click handler. That way, whenever you need to change the value just change the variable and the event will handle it accordingly. It will probably require you to use an arrow function for your handler, though — Ayrton
– Ayrton, Commented Oct 16, 2019 at 16:48

htmler · Accepted Answer · 2019-10-16 17:19:31Z

1

Alright, the best way to do this is by adding custom data-attribute params to the element before chaining it with the click event:

$("#submitBtn").data("params", {
    one: "Parameter 1",
    two: "Parameter 2"
}).click();

And you can use params like this:

$("#submitBtn").on('click', function () {

    // Parameter 1
    alert( $(this).data("params").one );

    // Parameter 2
    alert( $(this).data("params").two );

    // Do other stuff

});

Check working demo

edited Oct 16, 2019 at 17:19

answered Oct 16, 2019 at 17:06

htmler

3801 gold badge4 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Hizem · Accepted Answer · 2019-10-16 16:43:29Z

0

You can use the event handler .trigger() instead of .click() Syntax :

.trigger( eventType [, extraParameters ] )

Example:

.trigger('click',[param1,param2])

After that you can get those params from your call back function after event param

answered Oct 16, 2019 at 16:43

Hizem

19110 bronze badges

2 Comments

Nate Pet Over a year ago

How do I get the value of the input parameter from $("#submitBtn").on?

Hizem Over a year ago

You have to reference the html element of the input param using Jquery example : $('#inputId').val() and pass it as an argument to the trigger param your function become like this $('#submitBtn').trigger('click',$('#inputId').val()); dont forget to change the input id

jayachandran m · Accepted Answer · 2019-10-16 16:39:57Z

0

Click is a event generated and cannot pass the message/data. Instead you can pass the args to the listener(calling method).so that it can be captured to that method. for e.g

<button onclick="handleClick('msg',event)"></button>

answered Oct 16, 2019 at 16:39

jayachandran m

9

Comments

Ahmad ikram · Accepted Answer · 2019-10-16 16:48:52Z

0

You can use .trigger() instead.

$('#submitBtn').trigger('click', [arg1, ...]);

You can retrieve the parameters passed when attaching the click handler

$('#submitBtn').on('click', function(e, arg1, ...) {
});

answered Oct 16, 2019 at 16:48

Ahmad ikram

1402 bronze badges

Comments

Shir Gans · Accepted Answer · 2019-10-16 16:52:50Z

0

You can you jQuery(this).attr('action') ... Inside the function And on the element add attribute as follow data-action('myaction')

answered Oct 16, 2019 at 16:52

Shir Gans

2,0374 gold badges24 silver badges40 bronze badges

Collectives™ on Stack Overflow

Pass input parameter to .click event

5 Answers 5

Comments

2 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

2 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related