Results 1 to 5 of 5

Thread: ExtJs 6 MVVM form isDirty is always true

  1. #1

    Default ExtJs 6 MVVM form isDirty is always true


    in a simple MVVM case (non-Store) my form is always returning isDirty = true even for no change. I've also set trackResetOnLoad: true but there is no impact on implementation. Below is the fiddle i've created please suggest.


  2. #2
    Sencha User
    Join Date
    Mar 2012
    Chennai, India


    You are binding the value to the form using ViewModel. Thus ViewModel uses 'setValue()' method of the field to assign value, your form turns dirty at the very instant the page is loaded.

    If you don't want your form to return dirty initially, then you have to follow some other methods to assign initial values to the form fields. One way is the old school method, assign value directly to the field when the form is created.

            fieldLabel: 'First Name',
            value: 1,
            name: 'first'
    like this. It won't mark your form dirty. Hope it helped.

  3. #3

    Default Using MVVM already cannot change it

    The fiddle is just an example to show that i'm using MVVM. but I've viewModel's properties updated by controller so i'll need it the way it's inside example. Now is there a way even if it's calling setValue internally it doesn't make it dirty because this is ExtJs 5 + feature.

  4. #4


    I'm facing the same problem when synchronizing a grid with a form! Is there a workaround for that problem?

  5. #5
    Sencha Premium Member twasink's Avatar
    Join Date
    Oct 2012
    Brisbane, Australia

    Default resetOriginalValue is your friend

    In your view controller, you can implement the 'initViewModel' method to be informed of the act of binding the view model to the form. In that method, you can reset the original value of your fields, using 'Ext.form.field.Field#resetOriginalValue'.

    Something like this (but not necessarily exactly this):

    initViewModel: function(viewModel) {
      // may need to do this to set the values. may not.
      // Walk through all the fields in the form
      var form = this.getView().down('form'); // Your selector may be different.
      form.queryBy(function(component) { return !!component.isFormField; })
        .forEach(function(formField) { formField.resetOriginalValue(); })
    Something similar can be done after synchronising with a grid, though in that case, you're probably better off using the 'Ext.form.Basic#setValues' method.

    Note that you can mix the old-style approach (to set the _original_ value of the form field) with the new MVVM approach (to keep the view model consistent with the displayed values)

Similar Threads

  1. Replies: 4
    Last Post: 8 Jul 2011, 4:38 AM
  2. Form.isDirty() with trackResetOnLoad: true
    By mohaaron in forum Ext 3.x: Help & Discussion
    Replies: 15
    Last Post: 10 Jan 2011, 10:42 AM
  3. Replies: 9
    Last Post: 14 Oct 2010, 4:25 AM
  4. [SOLVED]why field.isDirty()==true after form.loadRecord()
    By jdeyrieux in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 12 Mar 2008, 6:01 AM
  5. why field.isDirty()==true after form.loadRecord()
    By jdeyrieux in forum Ext 2.x: Help & Discussion
    Replies: 0
    Last Post: 12 Mar 2008, 5:38 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts