Scroll Top

Finding out what all has changed on a Form

Many a times, to optimise the amount of data to be sent to the server, you may have a need to find out what exactly has changed on a form so that you can send only the changed data to the back-end rather than the complete data. Also, from audit purpose, it is very important that we identify what fields user has actually changed so that the proper logging may be done on the server side. Here is a way to achieve this on a form panel:

isDirty() function

      : ExtJS provides the isDirty() function for all the form fields as well on the FormPanel. The call to isDirty() returns true when the value of a form field has changed from its original value. For a FormPanel the call returns true if any field of a FormPanel has changed from its original value. If the form panel is not too big (not having 100s of fields), then the easiest way to get what has changed is to check whether the form fields are marked dirty. The following code adds a function getChangedData() to the FormPanel, which loops through each form item and checks whether they are marked dirty or not. If yes, the function returns the field name, original value, and the new value.

And you can call this function when user clicks on the Submit/Save/Post button. Something like this:

Related Posts

Leave a comment

Privacy Preferences
When you visit our website, it may store information through your browser from specific services, usually in form of cookies. Here you can change your privacy preferences. Please note that blocking some types of cookies may impact your experience on our website and the services we offer.