1. #1
    Sencha User
    Join Date
    Jul 2012
    Posts
    33
    Vote Rating
    0
    raminbp is on a distinguished road

      0  

    Default Unanswered: how to put text on both side of a textfield ?

    Unanswered: how to put text on both side of a textfield ?


    hello

    i need to know how to put text on both side of a textfield.
    in an ordinary situation you can put a text as fieldLabel on left or right side of
    the a textfield , but i want to have text on both side.
    i already made it using two label components on both side of the textfield (textfield fieldLabel is set to be hidden) but im sure it's wrong , and it can and should be more straight and simple.

    here is what i've done :
    Code:
    {
        xtype : 'fieldset',
        border : false,
        items : [
            {
                 xtype : 'label',
                 text : 'LeftSide Text...',
                 style : 'float:left;'
            },
             {
                  xtype : 'textfield',
                  hideLabel : true,
                  style : 'float:left;'
             },
              {
                   xtype: 'label',
                   text : 'RighSide Text...'
              }
        ]
    }
    any idea can be helpful ...

    thanks

  2. #2
    Sencha User
    Join Date
    Jun 2012
    Location
    India
    Posts
    50
    Vote Rating
    3
    Answers
    4
    girish.arjunagi is on a distinguished road

      0  

    Default


    Instead of using 2 labels, You can have either one of the label as a boxLabel for textField and another one as label. If you want to use first label as boxLabel for textField have a config labelAlign: 'left' and vice versa.

  3. #3
    Sencha User
    Join Date
    Jul 2012
    Posts
    33
    Vote Rating
    0
    raminbp is on a distinguished road

      0  

    Default


    thanks for your reply .

    the point is , i cant use fieldLabel , because when you put an string as fieldLabel ,extjs adds a colon( after it which i don't want it , so i cant use it .

    even if your way was right , its not what i expected, i need something simpler . i want to know if, instead of two label component , there is a cofig or something similar to solve the problem .

  4. #4
    Sencha Premium Member krullj's Avatar
    Join Date
    Sep 2011
    Posts
    35
    Vote Rating
    7
    Answers
    2
    krullj is on a distinguished road

      0  

    Default


    What you can do is to simply use this one component to add text before and after the input field. In my test, the text showed up above and below the input field, but it's probably just a styling problem at that point, because the actual HTML looks proper.

    Here's the config you might want to try:
    Code:
    {
      xtype: 'textfield',
      beforeSubTpl: 'this is before',
      afterSubTpl: 'this is after'
    }

Thread Participants: 2

Tags for this Thread