1. #1
    Sencha User
    Join Date
    Nov 2009
    Posts
    29
    Vote Rating
    0
    Zoso is on a distinguished road

      0  

    Default How can I have the text in a Form Display field wrap when the window is too small?

    How can I have the text in a Form Display field wrap when the window is too small?


    I have several forms and use the displayfield type on those forms since I am just displaying info. However if a user makes the browser window smaller the text tends to get cutoff and I would prefer to have it wrap. I also would rather not set the parent window it is in to scroll.

    Is there a way to get the text to wrap. I found a way for a grid cell to wrap the text and it works great but I have not been able to figure it out for a displayfield. Here is the code from one of my forms with some displayfields on them.

    Code:
    {
        xtype: 'form',
        columnWidth: 0.5,
        border: 0,
        id: 'BUI_Column1',
        overflowX: 'auto',
        layout: {
            type: 'auto'
        },
        items: [
            {
                xtype: 'displayfield',
                id: 'BINetID_Display',
                width: 500,
                submitValue: false,
                fieldLabel: 'NetID',
                labelAlign: 'right',
                labelStyle: 'font-weight:bold;',
                labelWidth: 200
            },
            {
                xtype: 'displayfield',
                id: 'BIFirstName_Display',
                width: 500,
                submitValue: false,
                fieldLabel: 'First Name',
                labelAlign: 'right',
                labelStyle: 'font-weight:bold;',
                labelWidth: 200
            },
            {
                xtype: 'displayfield',
                id: 'BIDisplayName_Display',
                width: 500,
                submitValue: false,
                fieldLabel: 'Display Name',
                labelAlign: 'right',
                labelStyle: 'font-weight:bold;',
                labelWidth: 200
            },
            {
                xtype: 'displayfield',
                id: 'BIDepartment_Display',
                width: 500,
                submitValue: false,
                fieldLabel: 'Department',
                labelAlign: 'right',
                labelStyle: 'font-weight:bold;',
                labelWidth: 200
            },
            {
                xtype: 'displayfield',
                id: 'BIDescription_Display',
                maxWidth: 500,
                width: 500,
                submitValue: false,
                fieldLabel: 'Description',
                labelAlign: 'right',
                labelStyle: 'font-weight:bold;',
                labelWidth: 200
            },
            {
                xtype: 'displayfield',
                id: 'BIEmail_Display',
                width: 500,
                submitValue: false,
                fieldLabel: 'Return Email Address',
                labelAlign: 'right',
                labelStyle: 'font-weight:bold;',
                labelWidth: 200
            },
            {
                xtype: 'displayfield',
                id: 'BIStatus_Display',
                width: 500,
                submitValue: false,
                fieldLabel: 'Status',
                labelAlign: 'right',
                labelStyle: 'font-weight:bold;',
                labelWidth: 200,
                listeners: {
                    change: {
                        fn: me.onBIStatus_DisplayChange,
                        scope: me
                    }
                }
            },
            {
                xtype: 'displayfield',
                id: 'BIComments_Display',
                width: 500,
                submitValue: false,
                fieldLabel: 'Comments',
                labelAlign: 'right',
                labelStyle: 'font-weight:bold;',
                labelWidth: 200
            }
        ]
    },

  2. #2
    Sencha Premium Member
    Join Date
    Dec 2013
    Posts
    14
    Vote Rating
    0
    rahul.sood is on a distinguished road

      0  

    Default


    hi Zoso, Did you figure this out...maybe you can share if you did

Thread Participants: 1