Cannot pass jQuery object.method to another function to be executed

Question

I have the following JavaScript:

function MyMethod(func)
{
  func();
}

$('#Btn').on('click', function(e)
{
  e.preventDefault();

  var form = $(this).parent();

  MyMethod(form.submit);
});

http://codepen.io/chrisnicholson/pen/YGxOdJ

This doesn't work, giving the following error in Chrome:

jquery.min.js:4 Uncaught TypeError: Cannot read property 'trigger' of undefined

If I modify the call to MyMethod to use the following then it works:

MyMethod(function(){
  form.submit();
});

http://codepen.io/chrisnicholson/pen/amyRXX

Can someone explain why this is?

Boldewyn · Accepted Answer · 2016-09-30 10:04:13Z

2

Ah, good ol' binding of this at work! If you only provide the method, it will not be called on the form but on the global object, like

submit.call(window) // resp. undefined in strict mode. Hence the error, I guess.

where what you want is

submit.call(form)

One way to fix this: Bind the submit method to the form:

MyMethod(form.submit.bind(form));

edited Sep 30, 2016 at 10:04

answered Sep 30, 2016 at 9:52

Boldewyn

83.1k45 gold badges161 silver badges218 bronze badges

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

1 Comment

mplungjan Over a year ago

Is this complete? He is passing $form.submit instead of $form.get(0).submit - I cannot test my idea because a plugin is adding stuff to the forms

Sudharsan S · Accepted Answer · 2016-09-30 09:42:30Z

0

Your code be. Just pass the object is enough.

function MyMethod(formSubmit)
{
  formSubmit.submit();
}

$('#Btn').on('click', function(e)
{
  e.preventDefault();

  var form = $(this).parent();

  MyMethod(form);
})

answered Sep 30, 2016 at 9:42

Sudharsan S

15.4k4 gold badges34 silver badges51 bronze badges

1 Comment

Chris Over a year ago

That ties MyMethod strictly to forms. In my case (a dialog box) I simply want to execute the function passed to it, not necessarily a form object. It's my bad, I shouldn't have named the parameter formSubmit, instead simply func, I'll update my code.

jonnyhocks · Accepted Answer · 2016-09-30 09:45:13Z

-1

Without the parentheses, .submit would just be a property of the jQuery object that you have. In this instance, your form.

Adding the parentheses actually calls the .submit() method on the form object.

answered Sep 30, 2016 at 9:45

jonnyhocks

1311 gold badge3 silver badges9 bronze badges

Collectives™ on Stack Overflow

Cannot pass jQuery object.method to another function to be executed

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related