CODEWITHSUNDEEP
javascriptjquery
Student
Student

Reputation: 1863

How to capture clicked button in js functions?

I have to buttons like this:

<input type='submit' id='submit' class='processAnimation'>
<input type='reset' id='reset' class='processAnimation'>

Now I have two js function. First function is called when ajax request is started and seconf function is called when ajax request is completed.

this.showLoading = function () {
     backupsource = $('.processAnimation').attr('class');
     $('.processAnimation').removeAttr('class').addClass('disabled-btn processAnimation');
     $('.processAnimation').attr( 'backupsource', backupsource );
}

this.hideLoading = function () {        
    backupsource = $('.processAnimation').attr('backupsource');
    if( backupsource != undefined ) {
       $('.processAnimation').removeAttr('class').addClass( backupsource );
       $('.processAnimation').removeAttr('backupsource');
    }   
}

EDIT: Above two functions are working and moving flower replaced clicked button. When request is complete then button is back. Problem is that when I click one button it replace all buttons(class=procesAnimation) with moving flower.

Thanks

Upvotes: 1

Views: 3080

Answers (3)

Val
Val

Reputation: 17522

This is using the code u have currently

$('.processAnimation').click(function (){
   if($(this).attr('type')=='submit'){
      //submit has been clicked
   }else{
      //reset has been clicked
   }
});

but it looks like you should really be using ID's rather than class's

Upvotes: 2

sadmicrowave
sadmicrowave

Reputation: 40912

Since you haven't posted your click event binding I am going to take a quick guess and say that your selector is not set right or conflicts with another element. try something like this:

$('input').click(function(){
     switch( $(this).attr('id') ){
        case 'submit' :
            ShowLoading();
            break;
        case 'reset' :
            HideLoading();
            break;
      }
 });

and change the syntax of how you initialize the two functions to the following:

function ShowLoading(){
     //do your show loading procedure here
};

function HideLoading(){
    //do your hide loading procedure here
};

Upvotes: 2

Schovi
Schovi

Reputation: 1990

if you have jQuery it is simple

$('#submit').click(showLoading)
$('#reset').click(hideLoading)

Just two different binding of events.

or did I miss something? :)

Upvotes: 1

Related Questions