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

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar