1. #1
    Ext User
    Join Date
    Oct 2008
    Posts
    26
    Vote Rating
    0
    DirtDog is on a distinguished road

      0  

    Default Elements on Same Line

    Elements on Same Line


    I want to put TextFields, CheckBoxes, and plain text on the same line in a FormPanel.

    I searched the forums for an answer. The search results show that several users have asked a similar question. However, when I click on most of the search result links I get a "Page Load Error".

    For the links that do work the suggestions are to use a table.

    I want the fields to abut one another with a little spacing in between.

    Example:

    "Please enter your name [TextField], your age [TextField] and select your gender (0) Male or (0) Female"

    I reviewed all the config options for TextField and Label fields but I don't see anything which helps me control putting elements in the same line.

    DirtDog

  2. #2
    Sencha - Community Support Team jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    DC Area =)
    Posts
    16,364
    Vote Rating
    81
    jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all jay@moduscreate.com is a name known to all

      0  

    Default


    you need to use a combination of things. The following example from my book explains how to do it (look at the state and zip code fields).
    http://tdg-i.com/extjsinaction/chapt...fieldsets.html

  3. #3
    Sencha User TopKatz's Avatar
    Join Date
    Mar 2007
    Posts
    337
    Vote Rating
    1
    TopKatz is on a distinguished road

      0  

    Default


    Help would be a better location for this.

    I have personally used column layout in the past to do this sort of thing.

  4. #4
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,508
    Vote Rating
    57
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    The thing about Column layout is that the natural tab index will proceed down each column in turn, not from item to item in the row.

    This will become an issue when the new FocusManager is implemented which IIRC, uses the Component's natural order as the order of focus.
    Last edited by Animal; 21 Apr 2009 at 1:37 PM. Reason: Brainless! I meant tab index, not "z-order"

  5. #5
    Ext User
    Join Date
    Oct 2008
    Posts
    26
    Vote Rating
    0
    DirtDog is on a distinguished road

      0  

    Default What would be nice...

    What would be nice...


    What would be nice is if one could control whether an element goes on a line or breaks to the next line at the form level or per element (TextField, Label).

    In ASP.NET I can put elements on the same line:

    <asp:TextBox ...</asp:TextBox>some text<asp:TextBox ...</asp:TextBox>

    Or, easily break them onto new lines:

    <asp:TextBox ...</asp:TextBox>
    <br>some text
    <br><asp:TextBox ...</asp:TextBox>

    I'm wondering if it makes sense to have a parameter at the Form level like:

    freeFlowing: <false | true>

    If false then elements are positioned on new lines.
    If true then elements are positioned abutting to the last element.

  6. #6
    Ext JS Premium Member stever's Avatar
    Join Date
    Mar 2007
    Posts
    1,407
    Vote Rating
    6
    stever will become famous soon enough stever will become famous soon enough

      0  

    Default


    Quote Originally Posted by Animal View Post
    This will become an issue when the new FocusManager is implemented which IIRC, uses the Component's natural order as the order of focus.
    Is this part of the ARIA stuff that was supposed to hit with 3.0?

  7. #7
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,508
    Vote Rating
    57
    Animal has a spectacular aura about Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Yes, but I think it's going to be 3.1

    It's very nice. Total keyboard navigability by walking the Container->Component tree.

  8. #8
    Sencha User TopKatz's Avatar
    Join Date
    Mar 2007
    Posts
    337
    Vote Rating
    1
    TopKatz is on a distinguished road

      0  

    Default


    Quote Originally Posted by ijkl562 View Post
    ...spam deleted...
    W...T...F

    Can we get a mod to nuke this joker from orbit?

  9. #9
    Ext User
    Join Date
    Jul 2007
    Location
    Florida
    Posts
    9,996
    Vote Rating
    6
    mjlecomte will become famous soon enough mjlecomte will become famous soon enough

      0  

    Default


    FYI, in the future don't quote the spam, I had to edit your post to delete the spam also.

  10. #10
    Ext User
    Join Date
    Oct 2008
    Posts
    26
    Vote Rating
    0
    DirtDog is on a distinguished road

      0  

    Default Punted

    Punted


    I punted and created the layout as seen in the attached screenshot.

    Instead of trying to make a contiguous sentence with embedded TextFields, Checkboxes I used the normal layout of fields within the form and put in phrases in the place of the usual type of text used for a label.


    DirtDog
    Attached Images