Question

I have a JavaScript validation function and a jquery progress bar.
onclick of a button it is doing some validation and then some long database query in the background.I want to have a progress bar when this query is going on as well as that JavaScript function to execute before the back-ground process starts.
here is where it is calling JavaScript function

<input name="btnPublish" class="button1" type="button" id="btnPublish" value="Publish" onClick="disableActiveButtons()"> 

my jquery is like::

$('#btnPublish').click(function() { 
                     var val = 0;
                     var interval = setInterval(function(){ 
                     val = val+1;    
                     $('#pb').progressbar({ value: val});   
                     $('#percent').text(val + '%'); 
                     if(val == 100){
                         clearInterval(interval);
                        }
                     }, 50);
                     });

can i include this jquery inside the JavaScript validation function so that both of them works?
if not how should i implement so that I have progress bar and JavaScript validation too?
Thanks

Answer 1

To call the javascript function from within your JQuery onClick you would do :

Remove onclick attribute fom the input tag :

<input name="btnPublish" class="button1" type="button" id="btnPublish" value="Publish"> 

And call the function as :

$('#btnPublish').click(function() { 

                 if(!disableActiveButtons()) 
                     return false; //cancel the event if validation failed , else continue 
                 var val = 0;
                 var interval = setInterval(function(){ 
                 val = val+1;    
                 $('#pb').progressbar({ value: val});   
                 $('#percent').text(val + '%'); 
                 if(val == 100){
                     clearInterval(interval);
                    }
                 }, 50);
                 });

Hope this helps.