1. #51
    Sencha Premium Member
    Join Date
    Dec 2012
    Posts
    17
    Vote Rating
    2
    dominic_u is on a distinguished road

      0  

    Default


    Thanks

    Quote Originally Posted by sencha.user View Post
    You can either change your JSON response to return without root or try in DynamciReader.js like,

    Code:
    readRecords: function(datastr) {
            var data = {};
            if(datastr.Data){
                data = datastr.Data;
                }
            if (data.length > 0) {
            .
            .
            .
            return this.callParent([data]);
            }
    Hope this will work.

  2. #52
    Sencha Premium Member
    Join Date
    Dec 2012
    Posts
    17
    Vote Rating
    2
    dominic_u is on a distinguished road

      0  

    Default Still wont work Dynamic Form in Sencha Architect

    Still wont work Dynamic Form in Sencha Architect


    Hi

    the code below didnt work. I wonder why it didnt trigger the metachange? Can someone help me what is my mistake
    Code:
    readRecords: function(datastr) {        var data = {};        if(datastr.Data){            data = datastr.Data;            }        if (data.length > 0) {        .        .        .        return this.callParent([data]);        }

  3. #53
    Sencha User
    Join Date
    Nov 2012
    Posts
    11
    Vote Rating
    0
    pancho.munyoz is on a distinguished road

      0  

    Default


    do you know how make the same example charting the data values from the dynamic grid??

  4. #54
    Sencha User
    Join Date
    Nov 2012
    Posts
    11
    Vote Rating
    0
    pancho.munyoz is on a distinguished road

      0  

    Default


    Hi, I trying whit that code for dynamic chart.
    I have been guided in the sample code in the url github.com/nonameplum/DynamicGrid.
    The code like that:

    Code:
    /**
     * Lukas Sliwinski
     * sliwinski.lukas@gmail.com
     *
     * Dynamic grid, allow to display data setting only URL.
     * Columns and model will be created dynamically.
     */
    Ext.Loader.setConfig({
        enabled: true
    });
    
    
    
    
    Ext.define('Ext.ux.grid.DynamicChart', {
        extend: 'Ext.grid.Panel',
        alias: 'widget.dynamicChart',
        alternateClassName: 'Ext.grid.DynamicChart',
        requires: [
        'Ext.data.JsonStore',
        'Ext.chart.theme.Base',
        'Ext.chart.series.Series',
        'Ext.chart.series.Line',
        'Ext.chart.axis.Numeric'
        ],
        // URL used for request to the server. Required
        url: '',
        width: 900, 
        height: 200,
        frame: true,
        initComponent: function() {
            var me = this;
            if (me.url == '') {
                Ext.Error.raise('url parameter is empty! You have to set proper url to get data form server.');
            }
            else {
                Ext.applyIf(me, {
                    layout: 'fit',
                    height: 300,
                    items: {
                        xtype: 'chart',
                        animate: true,
                        shadow: false,
                        store:  'Chart', 
                        legend: {
                            position: 'right'
                        },
                    
                        //forceFit: true,
                        store: Ext.create('Ext.data.Store', {
                            series: [],
                            // Fields have to be set as empty array. Without this Ext will not create dynamic model.
                            axes: [],
                            // After loading data grid have to reconfigure columns with dynamic created columns
                            // in Ext.ux.data.reader.DynamicReader
                            listeners: {
                                'metachange': function(store, meta) {
                                    me.reconfigure(store, meta.columns);
                                }
                            
                            },
                            autoLoad: true,
                            remoteSort: false,
                            remoteFilter: true,
                            remoteGroup: false,
                            proxy: {
                                reader: 'dynamicReaderChart',
                                type: 'rest',
                                url: me.url
                            }
                        })
                    }
                });
            }
            me.callParent(arguments);
        }
            
    });
    and

    Code:
    Ext.apply(Ext.data.Types, {
        FLOATORSTRING: {
            convert: function(v, n) {
                v = Ext.isNumeric(v) ? Number(v) : v;
                return v;
            },
            sortType: function(v) {
                v = Ext.isNumeric(v) ? Number(v) : v;
                return v;
            },
            type: 'floatOrString'
        }
    });
    
    
    
    
    Ext.define('Ext.ux.data.reader.DynamicReader', {
        extend: 'Ext.data.reader.Json',
        alias: 'reader.dynamicReader',
        alternateClassName: 'Ext.data.reader.DynamicReader',
        
        readRecords: function(data) {
                
            if (data.length > 0) {
                var item = data[0];
    
    
                var columns = new Array();
                var labels = new Array();
                var fields = new Array();
                var xFields = new Array();
                var p;
                var position = 'left';
    
    
                var series = new Array();
                var axes = new Array();
                for (p in item) {
                    if (p && p != undefined) {
                        // floatOrString type is only an option
                        // You can make your own data type for more complex situations
                        // or set it just to 'string'
                        if (p=='id'||p=='Equipo'||p=='Locatizacion'||p=='Nombre Medicion'||p=='Unidad Medicion'||p=='Label'){
                            position = 'left';
                            fields = [];
                            
                            if (p=='Equipo'){
                                fields.push(p);   
                                axes.push({
                                    type: 'Numeric',
                                    position:position,
                                    fields:fields
                                });
                            }
                            
                            
                        }
                        else {
                            xFields.push(p);
                            fields = [];
                            position = 'bottom';
                            fields.push(p);
                            axes.push({
                                type: 'Category',
                                position:position,
                                fields:fields
                            });     
                        }
                        
                        series.push({
                            type: typeChart,
                            lineWidth: 1,
                            showMarkers: false,
                            fill: true,
                            axis: 'left',
                            xField: xFields,
                            yField: 'Label',
                            style: {
                                'stroke-width': 1,
                                stroke: 'rgb(148, 174, 10)'
    
    
                            }
                        })
    
    
                    
                        fields.push({
                            name: p, 
                            type: 'floatOrString'
                        });
                        columns.push({
                            text: p, 
                            dataIndex: p,
                            filter: {
                                type: 'string'
                            }
                        });
                        labels.push(p);
                    }
                }
    
    
                data.metaData = {
                    axes: axes, 
                    series: series
                };
            }
    
    
            return this.callParent([data]);
        }
    but don't work

  5. #55
    Sencha User
    Join Date
    Sep 2010
    Posts
    4
    Vote Rating
    0
    to_utopia is on a distinguished road

      0  

    Default How to specify the renderer property

    How to specify the renderer property


    Hi,thanks for your share of this plugin first.
    I meet some problems when I use it.
    when I add "renderer" property using my function in columns returned from server,
    it doesn't work. but when I set "renderer":"usMoney" in columns, it works well.
    What's wrong with it? how to use my custom function?

    Thanks for all your help.

    JSON code example:

    {
    "text": "PercentChange",
    "renderer": "percentRender",
    "dataIndex": "pct"
    }

    it not works!
    but following works well!
    {
    "text": "PercentChange",
    "renderer": "usMoney",
    "dataIndex": "pct"
    }

  6. #56
    Sencha User
    Join Date
    Jun 2012
    Posts
    5
    Vote Rating
    0
    azmen01 is on a distinguished road

      0  

    Default GroupedHeaderGrid (dynamic) - bug?

    GroupedHeaderGrid (dynamic) - bug?


    Hi,

    i dont know whats going on?? - i will creaete a dynamic grouped-header-grid! I have test it @DynamicRedaer.js with this static code...

    PHP Code:
    columns.push({
      
    text'Category Header',
      
    columns: [{
        
    header'First Sub Header',
        
    dataIndex'subHeaderField1'
      
    }, {
        
    header'Second Sub Header',
        
    dataIndex'subHeaderField2'
      
    }]
    }); 
    screenshot.jpg

    ...but the result i dont understand!! - has anyone an idea

  7. #57
    Sencha Premium Member
    Join Date
    Jan 2012
    Posts
    1
    Vote Rating
    0
    Radhika_jaju is on a distinguished road

      0  

    Default


    I was trying to work out this example , however, i find that the metachange event is not getting fired and hence the grid is not getting reconfigured.
    I am using the same code and the dynamic reader is extending from json reader. Please help!!

  8. #58
    Sencha Premium Member
    Join Date
    Aug 2012
    Location
    Estonia
    Posts
    198
    Vote Rating
    0
    mmuruev is on a distinguished road

      0  

    Default


    Hi, if use that plagin that about if I have additional fields from form which not mention in server responce. Any change to send that new field back to server? Just add new records with new columns just send only server provided fields.

  9. #59
    Sencha User
    Join Date
    Jun 2013
    Posts
    26
    Vote Rating
    0
    mkm_2013 is on a distinguished road

      0  

    Default Combobox in dynamicGrid

    Combobox in dynamicGrid


    How to place combobox in editable dynamicGrid. The columns and fields are dynamic(getting from db).here is my json .
    I am gettign error store is undefined. Please help
    {
    "editor": {
    "listeners": {
    "scope": "this",
    "select": "selectText"
    },
    "store": "genderStore",
    "displayField": "gender",
    "name": "genderCombo",
    "xtype": "combo",
    "typeAhead": true,
    "triggerAction": "all",
    "mode": "local"
    },
    "hidden": false,
    "sortable": true,
    "width": 100,
    "dataIndex": "gender",
    "header": "Gender"
    }
    ],

  10. #60
    Sencha User
    Join Date
    Jul 2012
    Posts
    23
    Vote Rating
    2
    hlurger is on a distinguished road

      0  

    Default Define fields and columns in JSON response

    Define fields and columns in JSON response


    Ext.ux.DynamicReader understands now following json string

    Code:
    {
    	fields: [
    		{"name":"Data", "type":"Date"},
    		{"name":"Test", "type":"Boolean"},
    	],
    	columns: [
    		{"name":"Data", "xtype":"datecolumn", "format":"Y" },
    		{"name":"Test", "xtype":"checkcolumn" }
    	],
    	data: [    
    		{"Data":"2012-09-08 10:48:24","Name":"Adam","Result":"4.01","Test":"true"},
    		{"Data":"2012-09-08 10:48:34","Name":"Carol","Result":"5.26"},
    		{"Data":"2012-09-08 10:48:52","Name":'Jim',"Result":"6.66"},
    		{"Data":"2012-09-08 10:49:02","Name":'Jeniffer',"Result":"6.47"},
    		{"Data":"2012-09-08 10:49:12","Name":'Joanna',"Result":"6.62"},
    		{"Data":"2012-09-08 10:49:22","Name":'David',"Result":"5.98"},
    		{"Data":"2012-09-08 10:49:32","Name":'Lukas',"Result":"5.29"},
    		{"Data":"2012-09-08 10:49:42","Name":'Piter',"Result":"4.12"}
    	]
    }
    You can specify for each column a field configuration (see Ext.data.Model fields) and a columns configuration for the grid.

    It is still compatible with the original json response.

    You find the advanced DynamicReader.js as attachment.
    Attached Files