[Trinidad] Executing a JavaScript function when a validation error occurs

[Richard Yee <ri...@gmail.com>]

Hi,
I'm displaying a "Loading..." message to my user after they press a
commandButton by having an onclick event fire a JavaScript function. This
works fine except for when there is a validation error. In this case, the
"Loading..." message is still displayed. What I would like to have happen is
to hide the Loading message when this occurs. I tried setting the onload
event in the tr:document tag to clearProgress() but it didn't get called. Is
there another way to execute a JavaScript function when a validation error
occurs?

Thanks,
Richard


.jspx
....
<tr:commandButton text="Continue" action="#{myBacking.continueAction}"
onclick="showProgress()"/>
<tr:outputText id="loadProgress" inlineStyle="text-align:centered;
background-color: red; display: none;" value="Loading..."/>
....

JavaScript:
function showProgress() {
  var progressElem = document.getElementById("loadProgress");
  progressElem.style.display = 'inline';
}

function clearProgress() {
  var progressElem = document.getElementById("loadProgress");
  progressElem.style.display = 'none';
}

Re: [Trinidad] Executing a JavaScript function when a validation error occurs

[Richard Yee <ry...@cruzio.com>]

More specifically, I found that the client side javascript validation is 
getting invoked since I have set the 'required' attribute to true and 
thus the page is not getting reloaded. Is there a way to hook in to the 
client side javascript validation and have a custom javascript function 
called (ie. clearProgress())?

Thanks,

Richard


Richard Yee wrote:
> Hi,
> I'm displaying a "Loading..." message to my user after they press a 
> commandButton by having an onclick event fire a JavaScript function. 
> This works fine except for when there is a validation error. In this 
> case, the "Loading..." message is still displayed. What I would like 
> to have happen is to hide the Loading message when this occurs. I 
> tried setting the onload event in the tr:document tag to 
> clearProgress() but it didn't get called. Is there another way to 
> execute a JavaScript function when a validation error occurs?
>  
> Thanks,
> Richard
>  
>  
> .jspx
> ....
> <tr:commandButton text="Continue" action="#{myBacking.continueAction}" 
> onclick="showProgress()"/>
> <tr:outputText id="loadProgress" inlineStyle="text-align:centered; 
> background-color: red; display: none;" value="Loading..."/>
> ....
>  
> JavaScript:
> function showProgress() {
>   var progressElem = document.getElementById("loadProgress");
>   progressElem.style.display = 'inline';
> }
>  
> function clearProgress() {
>   var progressElem = document.getElementById("loadProgress");
>   progressElem.style.display = 'none';
> }