1. #1
    Ext User
    Join Date
    Apr 2007
    Posts
    379
    Vote Rating
    0
    sfwalter is on a distinguished road

      0  

    Default Form field marked with an error too soon

    Form field marked with an error too soon


    Hi,

    I have standard html form that I am applying Ext fields to. I have two fields and mark them both as "required". When I tab off the first field you see the indicator that the field failed validation (which is correct). However focus is on the second field and it is marked as invalid even though I am still on that second field.

    Here is the Ext snippet that I used:

    var v1 = new Ext.form.TextField({allowBlank:false});
    v1.applyTo('combo-local');
    var v2 = new Ext.form.TextField({allowBlank:false});
    v2.applyTo('combo-ajax');

    I can provide an example if needed

  2. #2
    Ext JS Premium Member
    Join Date
    Mar 2007
    Posts
    61
    Vote Rating
    4
    ap is on a distinguished road

      0  

    Default


    Try to set 'validationDelay' to a bigger number. Default is 250 ms

  3. #3
    Ext User
    Join Date
    Apr 2007
    Posts
    379
    Vote Rating
    0
    sfwalter is on a distinguished road

      0  

    Default


    I tried setting it to a large number like 5000 (5 seconds) and I can see the delay is working. But when the field receives focus after 5 seconds its getting marked as invalid.

  4. #4
    Ext JS Premium Member
    Join Date
    Mar 2007
    Posts
    61
    Vote Rating
    4
    ap is on a distinguished road

      0  

    Default


    It's interesting, I just tried all my from.TextField. Until you start type in a blank text field or lose the focus, the validation is not going to kick in. The default validationEvent is set to "keyup". So your validate blank input should not be fired if you just sit your focus and not type anything regardless of how long. Until you start typing or lose focus.

    Maybe you should try to set validationEvent:"keyup" just in case it was set somewhere else. I don't have the problem and if you check the examples none of them have this problem.

  5. #5
    Ext User
    Join Date
    Apr 2007
    Posts
    379
    Vote Rating
    0
    sfwalter is on a distinguished road

      0  

    Default


    very weird problem. I fired up the demo pages at extjs.com, http://extjs.com/deploy/ext/examples/form/dynamic.html. I start at the first field in the first form and I leave the the first field, which fails validation. I then tab all the way through the fields until I get to the "Date of birth field" in the third form. When I get to that field it marks the field as failing validation.

    Could this be a mac platform issue? I tried it both on firefox and safari with the same problem.

    cheers,

    scott

  6. #6
    Sencha User
    Join Date
    Mar 2007
    Posts
    7,854
    Vote Rating
    4
    tryanDLS is on a distinguished road

      0  

    Default


    It works the same on PC. That birthdate field has allowBlank:false. If you set that true if won't invalidate the empty field.

  7. #7
    Ext User
    Join Date
    Apr 2007
    Posts
    379
    Vote Rating
    0
    sfwalter is on a distinguished road

      0  

    Default


    Which is true, the case I'm seeing is when you tab into the birthday field (which has allowBlank:false.) the field is being marked as invalid. The user hasn't pressed anything besides tabbing into the field.

    scott.

  8. #8
    Sencha User
    Join Date
    Mar 2007
    Posts
    7,854
    Vote Rating
    4
    tryanDLS is on a distinguished road

      0  

    Default


    You're right. I misread that. On PC FF2/IE6/7 it does invalidate on field entry also

  9. #9
    Sencha User jack.slocum's Avatar
    Join Date
    Mar 2007
    Location
    Tampa, FL
    Posts
    6,955
    Vote Rating
    16
    jack.slocum will become famous soon enough

      0  

    Default


    The issue is when tabbing, the keyup fires in the destination field which triggers a validation.

    This is fixed in SVN. Thanks.
    Jack Slocum
    Ext JS Founder
    Original author of Ext JS 1, 2 & 3.
    Twitter: @jackslocum
    jack@extjs.com