how i set loading on save button extjs4?

Question

Hi i have save button and submit form, when i click show loading icon when form are not submitted. Please help me, in extjs 4.

buttons:[{ 
   text: save,
   handler: function(){ 
      form.submit({ 
          /sucess or failure code here; 
      }) 
   }
}]

Answer 1

• First you need a gif file for "waiting icon" with appropriate size.
• Then you create a css class for your "Save" button in waiting status. For example:

.save-waiting {
    background-image: url("url-to-your-waiting-gif-file");
}

• Finally toggle the Save button to include this class when submitting form with:

saveButton.addCls('save-waiting');
    // may disable the save button here

After successful response of submission, you remove the "waiting status" on the button or something else

saveButton.removeCls('save-waiting');