What's New?

[CLOSED] Items not showing as part of Ext.form.CompositeField

  1. #1
    Dec 10, 2010, 2:22 PM

    [CLOSED] Items not showing as part of Ext.form.CompositeField

    I have built a custom control that inherits from Ext.form.CompositeField that contains 2 components (1 ComboBox to select the month and 1 ComboBox to select the year). I have added the controls by applying the following code below.

    Ext.ux.AccountingPeriod = Ext.extend(Ext.form.CompositeField,
{
    constructor: function(cfg) {
        Ext.ux.AccountingPeriod.superclass.constructor.apply(this, arguments);

        this.addEvents
        (
            'periodchanged'
        );

        var combos = [
            new Ext.form.ComboBox({
                store: Ext.GregorianData.Months,
                autoShow: true,
                displayField: 'Name',
                typeAhead: true,
                mode: 'local',
                triggerAction: 'all',
                emptyText: 'Month',
                width: this.monthWidth,
                selectOnFocus: true,
                listeners: {
                    scope: this,
                    'select': function() {
                        this.fireEvent('periodchanged');
                    }
                }
            }),
            new Ext.form.ComboBox({
                store: Ext.GregorianData.Years,
                autoShow: true,
                displayField: 'Name',
                typeAhead: true,
                mode: 'local',
                triggerAction: 'all',
                emptyText: 'Year',
                width: this.yearWidth,
                selectOnFocus: true,
                listeners: {
                    scope: this,
                    'select': function() {
                        this.fireEvent('periodchanged');
                    }
                }
            })
        ];

        Ext.apply(this.items, combos);
    This used to work before the 1.0 upgrade. Now, I am getting an error stating this.items.items[0] is null. I have tried changing the references to this.items[0], this.items[1], etc. which gets rid of the error but the ComboBoxes are not visible.

    Do I need to apply the ComboBoxes to a different collection in 1.0? What changed in 1.0 with the CompositeField's items collection?

    Thank you in advance!
    Last edited by Daniil; Dec 11, 2010 at 11:21 AM. Reason: [CLOSED]
  2. #2
    Dec 10, 2010, 4:08 PM
    Hi,

    Please create items and add them to a config object before calling constructor of superclass.

    Example
    <%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Ext.Net Example</title>
    <ext:ResourcePlaceHolder runat="server" />

    <script type="text/javascript">
        Ext.ux.AccountingPeriod = Ext.extend(Ext.form.CompositeField,
        {
            constructor : function (cfg) {
                var combos = [
                    new Ext.form.ComboBox({
                        id : 'cmb1',
                        mode : 'local',
                        valueField : 'value',
                        displayField : 'text',
                        triggerAction : 'all',
                        store : new Ext.data.SimpleStore({ fields: ['text', 'value'], data: [['Item1', 'v1'], ['Item2', 'v2']] }),
                        value : 'v1'

                    }),
                    new Ext.form.ComboBox({
                        id : 'cmb2',
                        mode : 'local',
                        valueField : 'value',
                        displayField : 'text',
                        triggerAction : 'all',
                        store : new Ext.data.SimpleStore({ fields: ['text', 'value'], data: [['Item1', 'v1'], ['Item2', 'v2']] }),
                        value : 'v2'

                    })
                ];
                cfg.items = combos;
                Ext.ux.AccountingPeriod.superclass.constructor.apply(this, arguments);
            }
        });

        Ext.onReady(function () {
            new Ext.ux.AccountingPeriod({
                renderTo: Ext.getBody()
            });
        });
    </script>

</head>
<body>
    <form runat="server">
    <ext:ResourceManager runat="server" />
    </form>
</body>
</html>
  3. #3
    Dec 10, 2010, 7:27 PM

    Fixed It

    That worked great, thank you! I had to replace other config values from this.configProperty to cfg.configProperty. After that it worked the same as it did before.

Similar Threads

  1. [CLOSED] Combobox. show items with part of string instead of only from left to right..
    By CarWise in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Jul 12, 2012, 2:06 PM
  2. [CLOSED] Layout School Part II: Three items inside ViewPort (with nested items)
    By wagger in forum 1.x Legacy Premium Help
    Replies: 10
    Last Post: May 19, 2011, 7:43 AM
  3. [CLOSED] CompositeField - Height missing when form panel rendered hidden
    By craig2005 in forum 1.x Legacy Premium Help
    Replies: 9
    Last Post: Feb 07, 2011, 2:03 PM
  4. [1.0] clearInvalid() for CompositeField does not cascade to child items
    By r_honey in forum 1.x Legacy Premium Help
    Replies: 3
    Last Post: Oct 15, 2010, 8:10 PM
  5. [CLOSED] [1.0] CompositeField setDisabled override always enables child items
    By r_honey in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: May 24, 2010, 3:03 PM

Tags for this Thread

Posting Permissions