h:commandLink not firing the form.submit event

Question

When my page is loaded I execute the following JS script, which I use to display a popup saying (please wait...) when any form is submitted.

jQuery(function(){
  jQuery("form").submit(function(){jQuery('#wait-link').trigger('click');return true;});
});

This works fine when using h:commandButton tag, however when I use the h:commandLink tag it doesn't work because the form is submitted by java script (from the file jsf.js in the jar jsf-impl.jar) as shown below

mojarra.jsfcljs = function jsfcljs(f, pvp, t) {
  mojarra.apf(f, pvp);
  var ft = f.target;
  if (t) {
    f.target = t;
  }
  f.submit();
  f.target = ft;
  mojarra.dpf(f);
};

To solve this problem I copied the jsf.js file under WEB-INF/resources/javax.faces/jsf.js and modified it to trigger the form submit method using jQuery. This works fine but:

1) I don't like the fact that I am touching the jsf.js file since it may change in newer releases of JSF.

2) I don't like the fact that I am using jQuery inside the jsf.js file.

Is there a better solution to solve this problem?

bogdan.mustiata · Answer 1 · 2011-09-27T14:17:31.883

2

You should use jsf.ajax.*, since it is standard as part of the JSF2 spec. In there you have for example jsf.ajax.addOnEvent(callback) that does what you want.

After you hook in your listener, you can use as much jQuery as you want.

update:

If you want to intercept it from your own JS, without touching their stuff you can do:

(function() {
    var oldjsfcljs = mojarra.jsfcljs;

    mojarra.jsfcljs = function() { 
        console.log('my stuff before');
        oldjsfcljs.apply(this, arguments);
        console.log('my stuff after');
    }
})();

edited Sep 27 '11 at 14:17

answered Sep 27 '11 at 12:58

bogdan.mustiata

1,725
17
26

isn't the jsf.ajax.addOnEvent(callback) used in case of ajax only? – Omar Al Kababji Sep 27 '11 at 14:00
Yes. Even if for some weird reason you would need it for ANY kind of form, you can still intercept it from JS only, without touching those files: – bogdan.mustiata Sep 27 '11 at 14:15
Thanks that worked, but I have to mention that the jsf.ajax.addOnEvent(callback) has nothing to do with the problem. I will add the solution below in a separate answer. – Omar Al Kababji Sep 27 '11 at 14:43

Omar Al Kababji · Accepted Answer · 2011-09-28T08:06:05.150

1

As Bodgan suggested a better solution is to execute the following piece of code when the page is loaded, I don't know what the term is in JS but seems an override for me.

jQuery(function(){
  var oldjsfcljs = mojarra.jsfcljs; // save a pointer to the old function

  mojarra.jsfcljs = function jsfcljs(f, pvp, t) {
    jQuery(jq(f.id)).trigger('submit');
    oldjsfcljs.apply(this, arguments);
  };
});

function jq(myid) {
  return '#' + myid.replace(/(:|\.)/g, '\\$1');
}

Note: the jq() method is only used to escape the special characters in the form ID.

update: the above code seemed to work but if you have parameters in the form it wont so I had to rewrite the mojarra.jsfcljs function as follows:

jQuery(function(){
  mojarra.jsfcljs = function jsfcljs(f, pvp, t) {
    mojarra.apf(f, pvp);
    var ft = f.target;
    if (t) {
      f.target = t;
    }

    // trigger the submit event manually.
    jQuery(jq(f.id)).trigger('submit');

    f.submit();
    f.target = ft;
    mojarra.dpf(f);
  };
};

edited Sep 28 '11 at 08:06

answered Sep 27 '11 at 14:47

Omar Al Kababji

1,768
4
16
31

1

You need a "var" to the oldjsfcljs, otherwise you pollute the global scope. – bogdan.mustiata Sep 27 '11 at 15:00
Your original code is broken, because you apparently don't know JS. It should be either: `oldjsfcljs.apply(this, [f, pvp, t]);` either `oldjsfcljs.apply(this, arguments);` like in my code. `function.apply()` calls in JS have only 2 parameters: the this object, and a list like object with the arguments. – bogdan.mustiata Sep 27 '11 at 17:42
You are right about the (arguments) or [f,pvp,t] but this doesn't solve the problem, the problem is that the mojarra.apf(f, pvp) should be called before I trigger the submit event, the apf will add the key/value array pvp as hidden fields in the form and this is what makes it work. – Omar Al Kababji Sep 28 '11 at 08:05

h:commandLink not firing the form.submit event

2 Answers2

Linked