Primefaces AJAX callbacks: onstart vs. onclick

Question

I am using primefaces command button with following code.

<p:commandButton id="filereconSubmit" value="#{msg.button_submit}" oncomplete="completeWork();" onclick="clearPagination();filereconWidget.clearFilters();"           update="filereconModalDialog" action="#{reconController.register}" styleClass="content-data" />

above code works fine. but when I add javascript validate function, oncomplete is not fired.

onclick="clearPagination();filereconWidget.clearFilters();return validate(#{reconciliationController.reconSearchDays})"

Javascript code looks like below.

function completeWork() {
 PrimeFaces.clearSelection();
 $('th.ui-sortable-column').removeClass('ui-state-active').find('.ui-sortable-column-icon').removeClass('ui-icon-triangle-1-n ui-icon-triangle-1-s');
 showDatatable();
}

function validate(search_days){
 var isValid = false;
 var dateformat = "d-MMM-yyyy";
 var sdate = Date.parse(document.getElementById('filerecon:startdate_input').value, dateformat);
 var edate = Date.parse(document.getElementById('filerecon:enddate_input').value, dateformat);
 if(sdate == null || edate == null){
  alert("Enter both Start Date and End Date");
 } else if (sdate > edate) {
  alert("Select an End Date after the Start Date");
 } else if((edate-sdate)>(1000*60*60*24*search_days)){
  alert("Search is limited to "+search_days+" days. So End Date should not be more than "+search_days*24+" hours from Start Date.");
 } else {
  isValid = true;
 }
 return isValid;
}

I have gone through JSF execution order of events but couldn't figure out what's wrong there???

I am seeing js warning "unreachable code after return statement1" when javascript validate() method returns true. Is there any problem with validate() return logic???? — Hemachandra, Nov 20 '15 at 07:22
Removeall code in that function and start rebuilding… cause should be fairly easy to find then — Kukeltje, Nov 20 '15 at 08:45
And what happens between the onclick and the oncomplete? Everything works normal? — Kukeltje, Nov 20 '15 at 08:46
Sorry for delay in response @Kukeltje. I am able to solve this problem with the help of [ Primefaces AJAX callbacks: onstart vs. onclick](http://wrschneider.blogspot.in/2012/01/primefaces-ajax-callbacks-onstart-vs.html) article. Thanks a lot for your response. — Hemachandra, Nov 24 '15 at 07:34

score 0 · Accepted Answer · answered Jun 08 '16 at 09:29

Fix for this problem is

Consider this code:

        <p:commandLink action="#{bean.method}" onstart="return func()" ...>

If "func()" return false, this code will abort the AJAX request and bean.method() won't get called. If "func()" returns true, the AJAX request processes. If you replace onstart with onclick, the AJAX request will abort even if func() returns true.

That's because the Primefaces puts the code to generate the AJAX request in the onclick handler, pre-pending your code from the p:commandLink onclick before it. If your code returns, the AJAX request never gets sent.

Above explanation is from Primefaces AJAX callbacks: onstart vs. onclick

Primefaces AJAX callbacks: onstart vs. onclick

1 Answers1