1. #1
    Sencha User
    Join Date
    Jul 2010
    Posts
    17
    Vote Rating
    0
    ajmas is on a distinguished road

      0  

    Question Placing labels above fields with FormLayout?

    Placing labels above fields with FormLayout?


    I have a FormPanel (Ext.form.FormPanel) that contains a number of fields and sub panels (Ext.Panel). Each sub panel in turn has fields, but is uses the FormLayout. In the base panel I am able to get the fields to have their labels on top by using the "labelAlign: 'top'", but this does not work for the sub panels. The labels are defined as parts of the 'fieldLabel' attribute of the fields.

    Can anyone suggest an approach to getting the expected presentation?

    The code for the sub panel looks as follows:

    Code:
    Ext.ns('test.panel');
    
    test.panel,MyPanel = Ext.extend(Ext.Panel, {
        
        constructor: function ( config ) {
            
            config = config || {};    
            
            config = Ext.apply({
                title: 'Publication Details',
                layout: 'form',    
                defaults: {
                    hideLabels: false,
                    labelAlign: 'top'
                },
                layoutConfig: {
                    labelAlign: 'top'
                },
                items: [new Ext.ux.form.DateTime({
                    hideLabels: false,
                    fieldLabel: 'When',
                    name: 'publicationDate',
                    labelAlign: 'top'
                })],
                tools: [
                   {id:'help'}
                ]
            }, config );
            
            test.panel.MyPanel.superclass.constructor.call(this, config);
    
        }
    });

  2. #2
    Sencha User
    Join Date
    Jul 2010
    Posts
    17
    Vote Rating
    0
    ajmas is on a distinguished road

      0  

    Thumbs up Solved

    Solved


    Turns out that I should be placing the "labelAlign: 'top'" at the panel level

    Code:
    Ext.ns('test.panel');
    
    test.panel,MyPanel = Ext.extend(Ext.Panel, {
        
        constructor: function ( config ) {
            
            config = config || {};    
            
            config = Ext.apply({
                title: 'Publication Details',
                layout: 'form', 
                labelAlign: 'top',
                defaults: {
                    hideLabels: false
                },
                items: [new Ext.ux.form.DateTime({
                    hideLabels: false,
                    fieldLabel: 'When',
                    name: 'publicationDate'
                })],
                tools: [
                   {id:'help'}
                ]
            }, config );
            
            test.panel.MyPanel.superclass.constructor.call(this, config);
    
        }
    });

Similar Threads

  1. FormLayout : Prefix/Suffix to form fields
    By tof in forum Community Discussion
    Replies: 10
    Last Post: 16 Jan 2013, 8:51 AM
  2. Replies: 2
    Last Post: 1 Sep 2009, 1:38 AM
  3. Placing many Fields in a Row: MultiField?
    By Arno.Nyhm in forum Ext GWT: Discussion
    Replies: 1
    Last Post: 6 Aug 2009, 6:52 AM
  4. Ext.form: Placing two fields beneath each other
    By timo.nuros in forum Ext 1.x: Help & Discussion
    Replies: 1
    Last Post: 27 Sep 2007, 7:58 PM

Tags for this Thread

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi