Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Use jQuery .trigger to call a custom function that returns a value

Tags:

jquery

Is there any way using jQuery's .bind() and .trigger() calls to execute a user defined function (ex: save ()) and act upon the return from the method? For example:

$("#aForm").bind ('save', function () {
  return true;
});

and then:

if ($("#aForm").trigger ('save') == true) {
  doSomething ();
}
like image 769
Dave Avatar asked Jun 29 '10 16:06

Dave


People also ask

How do you trigger a function in JavaScript?

The trigger() method triggers the specified event and the default behavior of an event (like form submission) for the selected elements. This method is similar to the triggerHandler() method, except that triggerHandler() does not trigger the default behavior of the event.

What is trigger method in jQuery?

The trigger() method is a method in jQuery which is used to trigger a specified event handler on selected element. Syntax: $(selector).trigger(event, param1, param2) Note: Extra parameters can be passed in trigger() method. Example 1: This method triggered two methods to increase the value of method.

What is the jQuery method for attaching a custom event to an element?

bind() method is used for attaching an event handler directly to elements. Handlers are attached to the currently selected elements in the jQuery object, so those elements must exist at the point the call to . bind() occurs.

How do you trigger a click?

Answer: Use the jQuery click() Method You can use the click() method to trigger a click on a link programmatically using jQuery.


3 Answers

I know this question is old, but maybe this can help someone.

As Paliath pointed, you can't return a value because the trigger event is asynchronous. What you can do, is pass a object as parameter to the event. By default, javascript objects are always references to the original.

eg.:

bind:

$(...).bind('example',function (evt,ret) { 
    ret.val = false;
});

trigger:

var ret = {ret:true};
$(...).trigger('example',[ret]);
if (!ret.ret)
    //event return false
else
    //event returned true
like image 92
dmmd Avatar answered Nov 06 '22 22:11

dmmd


Check out triggerHandler(), which in many other ways acts like trigger() but will allow you to return a value.

From the docs:

The .triggerHandler() method behaves similarly to .trigger(), with the following exceptions:

  • The .triggerHandler() method does not cause the default behavior of an event to occur (such as a form submission).
  • While .trigger() will operate on all elements matched by the jQuery object, .triggerHandler() only affects the first matched element.
  • Events created with .triggerHandler() do not bubble up the DOM hierarchy; if they are not handled by the target element directly, they do nothing.
  • Instead of returning the jQuery object (to allow chaining), .triggerHandler() returns whatever value was returned by the last handler it caused to be executed. If no handlers are triggered, it returns undefined
like image 28
buley Avatar answered Nov 06 '22 22:11

buley


You can also use jQuery builtin event.preventDefault() and event.isDefaultPrevented():

$("#aForm").bind ('save', function (event) {
    return true;
    // "return false" or "event.preventDefault()" have the same effect
  }
});

and then:

var event = $.Event('save')
$("#aForm").trigger (event)
if (event.isDefaultPrevented() == false) {
  doSomething ();
}
like image 4
user1003545 Avatar answered Nov 06 '22 22:11

user1003545