Page 1 of 2 12 LastLast
Results 1 to 10 of 13

Thread: 3.0 broke form fields (emptyText)

  1. #1
    Sencha User mschwartz's Avatar
    Join Date
    Nov 2008
    Location
    San Diego, Peoples' Republic of California
    Posts
    2,061

    Default 3.0 broke form fields (emptyText)

    A form field's emptyText is being submitted to the server. The docs document this behaviour.

    This is wrong behaviour for emptyText and I think it is worth fixing in 3.0.

    It's text to be displayed if the field is empty, it has nothing to do with the value of the field in any way shape or form.

    What is the 3.x way to submit a form where the values are the actual values?

    Example:

    Code:
    var form = new Ext.form.FormPanel({
      items: [
        {
          xtype: 'textfield',
          name: 'mytext',
          value: '',
          emptyText: 'Please enter some text for myText'
       }
    });
    
    ...
    
    // submit button
    function onClick() {
        var f = form.getForm();
        f.submit({
           url: ...,
          success: function() {
              ...
          }
        });
    }
    f.submit is sending 'mytext=Please enter some text for myText' to the server if no text is entered in the field. I specified the value as '' and that's what it should send.

    Makes absolutely no sense to me why it should be this way.

    EDIT: I tested this with 2.x and it is the same behaviour and edited my post to reflect my thoughts.

  2. #2
    Sencha User mschwartz's Avatar
    Join Date
    Nov 2008
    Location
    San Diego, Peoples' Republic of California
    Posts
    2,061

    Default

    A strategy that would fix this and likely provide many other benefits...

    Ext already figures out if a form is multipart or has a file input field and calls doFormUpload(). If not, it calls seializeForm().

    A look at doFormUpload() reveals some interesting logic that appends hidden fields to the form in the DOM before posting it via hidden iframe. Nice.

    Use the same trick in serializeForm(). You know it's not an upload or multipart. So create a form element or use the existing one, loop through the Ext form (not the DOM one) and call getValue() on all the fields, append hidden field to this form for each one, and submit that.

    You can do similar inside doFormUpload().



    The serialization will be 100% slower, say, but who cares?

  3. #3
    Sencha User jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    DC Area =)
    Posts
    16,364

    Default

    Ext 2.x always submitted empty text

    hell, i think it stemmed from 1.x- if i can recall correctly.

    That said, this has been bubbled up to the core team and will be left as/is

  4. #4
    Sencha User mschwartz's Avatar
    Join Date
    Nov 2008
    Location
    San Diego, Peoples' Republic of California
    Posts
    2,061

    Default

    The reason I never saw this is most of my forms (over 1.5 years of programming Ext) I've serialized my own forms (except a few with file upload) and use Ext.Ajax.request directly.

    The few cases I have emptyText, I probably have allowBlank: false, too.

  5. #5
    Ext User
    Join Date
    Jul 2007
    Location
    Florida
    Posts
    9,996

    Default

    There's some old threads this topic you may or may not have found.

    I looked briefly into it wondering if there'd be an easy way to do setValues or something for any fields that value matched the emptyText to make those null.

    I don't much care for current behavior.

  6. #6
    Sencha User mschwartz's Avatar
    Join Date
    Nov 2008
    Location
    San Diego, Peoples' Republic of California
    Posts
    2,061

    Default

    Condor:

    See attached image to see what your override looks like.

    FF3.0.8 windows
    Attached Images Attached Images

  7. #7

  8. #8
    Sencha User mschwartz's Avatar
    Join Date
    Nov 2008
    Location
    San Diego, Peoples' Republic of California
    Posts
    2,061

    Default

    I see there's discussion about this going on in the premium forums.

    The strategy I suggested in a previous post should work.

    You use the existing form or create a new hidden one and temporarily replace the form fields with hidden fields with the same names and Ext.Field getValue() for the values. For all field types except file upload - those you use the existing DOM nodes or move the existing DOM nodes to the new form.

    The benefit of calling getValue() is huge. The Ext (and custom) fields are not DOM elements, they are wonderful javascript OO classes/objects. getValue() can do all kinds of things like convert a Date() into a timestamp or format it, a time field consisting of 3 spinner input fields can combine the hours, minutes, seconds into a single int value, and so on.

  9. #9
    Sencha User mschwartz's Avatar
    Join Date
    Nov 2008
    Location
    San Diego, Peoples' Republic of California
    Posts
    2,061

    Default

    I'm not a premium member so I can't post in that thread. Or I would

    Maye some moderator can move it or merge with this or something.

  10. #10
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,245

    Default

    I forgot to mention that you also need some extra CSS:
    Code:
    <style type="text/css">
    .x-field-empty-text {
    	color: gray;
    	padding: 3px 3px 0;
    	position: absolute;
    	left: -10000px;
    	top: -10000px;
    	visibility: hidden;
    }
    </style>
    ps. I did need to make a small change in the focus logic for IE6/7 (see thread). TriggerField still doesn't behave 100% on IE6/7...

Page 1 of 2 12 LastLast

Posting Permissions

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