Results 1 to 10 of 10

Thread: Bind and allowBlank:false - reset field with bind value | bug?

  1. #1
    Sencha Premium User
    Join Date
    Jul 2014
    Posts
    269
    Answers
    15

    Default Answered: Bind and allowBlank:false - reset field with bind value | bug?

    Hi!
    In forms, the config allowBlank: false is blocking the correct binding between fields, particularly when using:

    Code:
    hidden:'{!myfield}'
    Is this a bug?

    Note: In binding the reset () event does not work.

    Fiddle: when cleaning the fields, 'Viewer' fields values are not hidden



    It is possible to solve this jut with 'bind'?


    Possible solution (works bad in this case):

    Using the following function:

    Code:
            change: function(field, newValue, eOpts) {
                    var fieldViewer = Ext.ComponentQuery.query('#displayfielditemId')[0];
    
                    if(!Ext.isEmpty(newValue)) {
                          fieldViewer.setHidden(false);
                    }
                    else {
                           fieldViewer.setHidden(true);
                    }
                    this.fireEvent('blur');
            },
    Problem:
    if I choose the two dates and then I clean the two fields values, when I choose the first date again, the 'Viewer' displays the second earlier date.
    How to reset the 'Viewer' fields values, before hiding the 'Viewer' fields?

    Fiddle:


    Thanks in advance


    Edit 1:

    If the reset () event ran in the fields whose value results from a bind, maybe I could use beforehide method:

    Code:
    {
         xtype: 'displayfield',
          bind: {
               value:'<span>Name: </span>{myfield}',
               hidden:'{!myfield}'
           },
           listeners:{
                beforehide:function(field, eOpts){
                     this.reset();
                 }
           }        
     },


    But that does not work.
    Console says: Uncaught TypeError: binding.isReadOnly is not a function

    Edit 2:

    I tried like that too, without sucess:

    Code:
                bind:'{myfield1}',
                listeners:{                
                    change:function(field, newValue, eOpts){
                         
                        var displayfield = Ext.ComponentQuery.query('#displayfieldItemId')[0]; 
                        if(!Ext.isEmpty(newValue)){
                            displayfield.setVisible(true);
                        }
                        else{
                            displayfield.setVisible(false);
    
    
                            displayfield.setBind({value:null}); //here
      
                        }
                        this.fireEvent('blur');                   
                    }
                }



  2. Thanks Tristan

    I'm trying to get around, dynamically changing allowBlank to true (defaults true), clean the fields and then change again allowBlank to false.
    It seems to be a solution that works (with some bugs resolved with a focus sequence).

    Something like this:


  3. #2
    Sencha - Sustaining Engineer tristan.lee's Avatar
    Join Date
    Mar 2015
    Location
    Central Ohio
    Posts
    1,579
    Answers
    165

    Default

    The issue is that because you have allowBlank: false, whenever you clear out the fields, it becomes in an invalid state and does not commit it to the model. This goes for both cases where you are either clearing out the combo item or the dates. The view is representing the data in the model.
    Tristan Lee
    Sencha Inc - Sustaining Engineer


    Having an issue? Help us help you - be detailed; provide some code; demonstrate with a fiddle (fiddle.sencha.com)

    Embed your fiddle in your post: [FIDDLE]id[/FIDDLE]

  4. #3
    Sencha Premium User
    Join Date
    Jul 2014
    Posts
    269
    Answers
    15

    Default

    Thanks Tristan

    I'm trying to get around, dynamically changing allowBlank to true (defaults true), clean the fields and then change again allowBlank to false.
    It seems to be a solution that works (with some bugs resolved with a focus sequence).

    Something like this:


  5. #4
    Sencha User
    Join Date
    Mar 2011
    Location
    Arvada, CO
    Posts
    404
    Answers
    11

    Default

    Quote Originally Posted by tristan.lee View Post
    The issue is that because you have allowBlank: false, whenever you clear out the fields, it becomes in an invalid state and does not commit it to the model. This goes for both cases where you are either clearing out the combo item or the dates. The view is representing the data in the model.
    Still, wouldn't this be a bug? The view also represents what the user is editing, so if the user is editing something and changes the value of a field (that is bound to a model's property), then you would expect that value, no matter what it is, to propagate up to the model... not picking and choosing when or when not to propagate up.

  6. #5
    Sencha - Sustaining Engineer tristan.lee's Avatar
    Join Date
    Mar 2015
    Location
    Central Ohio
    Posts
    1,579
    Answers
    165

    Default

    I don't think that's the intended behavior of validation in this case. This is a design as of 5.0.1. It's not picking and choosing what gets to go and what doesn't. It's going based on the validity of the data. You could use the workaround presented above. I look at it in the same context as if I'm updating a database record and I don't want a column to be null, would I update the record anyway and null the column and inform the user after the fact, or would I prevent it up front?

    https://www.sencha.com/blog/whats-new-in-ext-js-5-0-1/ (see Model & Field Validation)

    If anything, I could see this being a feature request with the option to force update regardless of validity.
    Tristan Lee
    Sencha Inc - Sustaining Engineer


    Having an issue? Help us help you - be detailed; provide some code; demonstrate with a fiddle (fiddle.sencha.com)

    Embed your fiddle in your post: [FIDDLE]id[/FIDDLE]

  7. #6
    Sencha User
    Join Date
    Mar 2011
    Location
    Arvada, CO
    Posts
    404
    Answers
    11

    Default

    Quote Originally Posted by tristan.lee View Post
    I don't think that's the intended behavior of validation in this case. This is a design as of 5.0.1. It's not picking and choosing what gets to go and what doesn't. It's going based on the validity of the data. You could use the workaround presented above. I look at it in the same context as if I'm updating a database record and I don't want a column to be null, would I update the record anyway and null the column and inform the user after the fact, or would I prevent it up front?

    https://www.sencha.com/blog/whats-new-in-ext-js-5-0-1/ (see Model & Field Validation)

    If anything, I could see this being a feature request with the option to force update regardless of validity.
    While I agree with your analogy, it becomes a little different when I'm binding and listening for changes... changing to null, undefined, and empty are still valid changes... sure, it'll fail validation, but let the validation do its thing, and meanwhile, update the model... because otherwise, why would it keep the value before it? It's not like the user's going to go back to that value...

    Just to add to that, let's say I'm bound to a textfield... from a design perspective, I would expect a bound value to mirror what the textfield's value is, as that's what I'm bound to... but in fact, they're two completely different values. I realize you cited a source saying otherwise, but I would have to recall that from a 5.0.1 update guide.

  8. #7
    Ext JS Premium Member anselmtmcclain's Avatar
    Join Date
    Mar 2008
    Location
    Northern California
    Posts
    115
    Answers
    1

    Default

    Quote Originally Posted by incutonez View Post
    changing to null, undefined, and empty are still valid changes... sure, it'll fail validation, but let the validation do its thing, and meanwhile, update the model... because otherwise, why would it keep the value before it? It's not like the user's going to go back to that value...
    Perfectly expressed - just got bit by this ourselves and could not agree more.
    --------------
    Extremely Heavy Industries
    Thoughtful development for the modern web.
    http://xh.io | [email protected]

  9. #8
    Sencha Premium Member yorl1n's Avatar
    Join Date
    Mar 2015
    Location
    Germany
    Posts
    294
    Answers
    30

    Default

    I do not understand why the people use bind, even if it doesn't work? The topic starter use bind, and to fix it's behavior write some strange things in events. Why not to use only events?
    Actually I find this as misbehavior too, that invalid value isn't bound. To solve this I just made one override on bind logic to take control over this misbehavior:

    Code:
    Ext.override(Ext.form.field.Base, {
                publishValue: function () {
                    var me = this;
                    if (me.rendered) {
                        switch (me.bindOn) {
                            case 'valid':
                                if (!me.getErrors().length) {
                                    me.publishState('value', me.publishRaw ? me.getRawValue() : me.getValue());
                                }
                                break;
                            case 'invalid':
                                if (me.getErrors().length) {
                                    me.publishState('value', me.publishRaw ? me.getRawValue() : me.getValue());
                                }
                                break;
                            default:
                                me.publishState('value', me.publishRaw ? me.getRawValue() : me.getValue());
                        }
                    }
                }
            });
    There is small method publishValue, which decides when the value should be published. So there is superfluous code for someone, but maybe it will be helpful for me. So every field can have bindOn property with states: 'valid' - bind only when the value is valid(current behavior), 'invalid' - bind only if the value is invalid and defaults(when the property isn't specified) to both, so the value is always bound.

  10. #9
    Sencha - Sustaining Engineer tristan.lee's Avatar
    Join Date
    Mar 2015
    Location
    Central Ohio
    Posts
    1,579
    Answers
    165

    Default

    I created a bug report for this for our engineering team to review under EXTJS-20300.
    Tristan Lee
    Sencha Inc - Sustaining Engineer


    Having an issue? Help us help you - be detailed; provide some code; demonstrate with a fiddle (fiddle.sencha.com)

    Embed your fiddle in your post: [FIDDLE]id[/FIDDLE]

  11. #10
    Sencha User
    Join Date
    Nov 2014
    Posts
    10

    Default

    I was just wondering if there was an update on this. Would appreciate any insight.

Similar Threads

  1. Replies: 4
    Last Post: 18 Nov 2014, 1:01 PM
  2. Replies: 2
    Last Post: 29 Oct 2014, 4:02 AM
  3. Replies: 5
    Last Post: 21 Dec 2009, 4:08 AM
  4. reset not work if data bind
    By alien3d in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 11 Dec 2009, 7:06 PM

Posting Permissions

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