1. #1
    Sencha User
    Join Date
    Oct 2011
    Posts
    5
    Vote Rating
    0
    lucastp is on a distinguished road

      0  

    Default Problem using Ext.getCmp on child items

    Problem using Ext.getCmp on child items


    Hi,

    I am quite new with extjs 4 so I would like to ask you help about the following code

    var showInWindow = {
    id:'commissionWindow',
    xtype:'commissionearned',
    url: '/app/getdata.json',
    storeRoot: 'data',
    width:800,
    height: 600,
    ytitle:'Lines Sold',
    xtitle: 'Day',
    xlabelsize: '12px Arial',
    ylabelsize: '12px Arial',
    style: 'background:#fff',
    legend: {
    position: 'right'
    },
    chartType: 'line',
    animate:true

    };
    var window_c = Ext.create('Ext.window.Window', {
    id:'myWin',
    closeAction: 'hide',
    modal:true,
    hidden: false,
    maximizable: true,
    title: 'Column Chart',
    layout: 'fit',
    items: [showInWindow]

    });

    My problem is that if I try to execute Ext.getCmp('commissionWindow') I get undefined as returned value.

    Does anyone know why the component showInWindow is not registered with the id 'commissionWindow'?

    Thank you,

    Luca.

  2. #2
    Sencha User Tim Toady's Avatar
    Join Date
    Feb 2010
    Location
    Pennsylvania
    Posts
    580
    Vote Rating
    269
    Tim Toady has much to be proud of Tim Toady has much to be proud of Tim Toady has much to be proud of Tim Toady has much to be proud of Tim Toady has much to be proud of Tim Toady has much to be proud of Tim Toady has much to be proud of Tim Toady has much to be proud of

      0  

    Default


    Use code tags around your code [CODE]
    What is your definition of 'commissionearned'?

  3. #3
    Sencha User
    Join Date
    Oct 2011
    Posts
    5
    Vote Rating
    0
    lucastp is on a distinguished road

      0  

    Default


    Hi,

    the code is the following

    Ext.define('APP.charts.CommissionEarned', {
    extend : 'Ext.chart.Chart',
    alias: 'widget.commissionearned',
    requires : ['APP.model.LinesSoldChart'],
    config: {
    width: 280,
    height: 170,
    url: '/app/linesSoldChart.json',
    storeRoot: 'data',
    theme: 'Red',
    xtitle: null,
    ytitle: null,
    xlabelsize:'9px Arial',
    ylabelsize:'9px Arial',
    ratio:9,
    style: null,
    chartType: 'column',
    animate:true
    },
    constructor: function(config) {
    this.initConfig(config);
    this.callParent([{theme: this.theme}]);
    },
    initComponent : function() {
    this.store = this.buildStore();
    this.axes = this.buildAxes();
    this.series = this.buildSeries();
    this.callParent();

    },
    buildStore: function() {

    Ext.define('CommissionEarned', {
    extend: 'Ext.data.Model',
    fields: [{name:'commission', type:'int'}, {name:'year', type:'date', dateFormat: 'Y-m-d H:i'}]
    });
    return Ext.create('Ext.data.Store', {
    model: 'CommissionEarned',
    proxy: {
    type: 'ajax',
    url : this.url,
    reader: {
    type: 'json',
    root: this.storeRoot
    },
    extraParams:{type:'commission'},
    method: 'POST'
    },
    root: this.storeRoot,
    fields: this.fields,
    params: { type: 'commission'},
    autoLoad: true
    });

    },
    buildSeries: function(){

    return [
    { showMarkers: false,
    type: this.chartType,
    xField: 'year',
    yField: 'commission',
    yAxis: {
    labelRenderer: function(date) { return "£" + date; }
    },

    tips: {
    trackMouse: true,
    width: 150,
    height: 35,
    renderer: function(storeItem, item) {
    this.setTitle(Ext.util.Format.date(storeItem.get('year'),' D d F Y') + "<br/> <font color=\"blue\">Commission Earned:</font>" +storeItem.get('commission') +"$");
    // this.setTitle(storeItem.get('commission') + '$ Commission earned on ' + Ext.util.Format.date(storeItem.get('year'),' D Y-m-d'));
    }
    },
    style: {

    opacity: 0.93,
    size: 10
    },
    listeners:{
    itemmousedown : function(obj) {

    }
    }
    }
    ]

    },
    buildAxes : function(){
    var xlabel = this.xlabelsize;
    var ylabel = this.ylabelsize;
    return [

    {
    id: 'commission',
    type: 'Numeric',
    position: 'left',
    title: this.ytitle != null ? this.ytitle: null,
    animate: true,
    fields: ['commission'],
    minimum: 0,
    grid: true,
    titlePosition: 'top',
    label: {
    font: ylabel,
    renderer: function(com) {return com + " $";}
    }
    },
    {
    id: 'year',
    type: 'Time',
    position: 'bottom',
    title: this.xtitle != null ? this.xtitle: null,
    grid: true,
    dateFormat: 'd F', //'Y-m-d',
    ratio: this.ratio,
    filterInflection: function(index) {
    //alert(this);
    return ((index % this.ratio) == 0);
    },
    fields: ['year'],
    label: {
    font: xlabel,
    renderer: function(date) { return Ext.util.Format.substr(date,0,6); }
    }
    }
    ];
    },
    changeChartScale: function(ratio,pos) {
    this.axes.get(pos).filterInflection = function(index) {
    return ((index % ratio) == 0);
    }
    },
    loadStoreByParams : function(params) {
    params = params || {};
    this.store.load({
    params : params
    });
    },
    setType : function(chartType) {
    this.chartType = chartType;
    alert(this.series.get(0).type);
    this.series.get(0).type = chartType;
    }
    });

    thanks,

    Luca.

Thread Participants: 1