1. #1
    Sencha User
    Join Date
    Dec 2012
    Posts
    5
    Vote Rating
    0
    CrazySerb is on a distinguished road

      0  

    Default How do I use calculations on JSON loaded data + rewrite some of the fields?

    How do I use calculations on JSON loaded data + rewrite some of the fields?


    I'm just wondering how do I the following:

    1) do calculations on JSON data fields before outputting them in the grid? for example, if I have Spend and Revenue fields in the example below, how do I fill the ROI field in the grid with Revenue/Spend calculation?

    2) how can I wrap links around some of these entries? for example, again, below, how can I get "a href=..." wrapped around PubName with some of the variables from the JSON feed itself, so have something like <a href="PubId">PubName</a> output instead of just PubName in the grid?


    Code:
    Ext.onReady(function(){
    
    var data = <?php echo $json; ?>;
        
       Ext.define('Placements', {
           extend: 'Ext.data.Model',
           fields: [
          {name: 'PubId',    type: 'int'},
          {name: 'PubName',    type: 'string'},
    
    
          {name: 'Imp',       type: 'int'},
          {name: 'Spend',        type: 'double'},
          {name: 'Revenue',    type: 'double'},
           ]
       });
        
        var store = Ext.create('Ext.data.Store', {
             autoLoad: true,
             data : data,
             model: 'Placements',
             proxy: {
              type: 'memory',
              reader: {
              type: 'json',
              //record: 'data_type'
              }
             }
        });
        
        Ext.create('Ext.Panel', {
             id: 'junk',
             renderTo: 'grid-table',
             width: 1024,
             height:800,
             layout: 'vbox',
             items: [
            {
                xtype: 'grid',
                title: 'Placements',
                width: 1024,
                height: 800,
                store: store,
                viewConfig: { emptyText: 'No data' },
                columns: [
                 { header: 'Placement',   dataIndex: 'PubName'},
                 { header: 'Impressions',    dataIndex: 'Imp'},
                 { header: 'Spend',        dataIndex: 'Spend'},
                 { header: 'Revenue',     dataIndex: 'Revenue'},
                 { header: 'ROI',      dataIndex: ''},
                ]
            }
             ]
        });
    
    
    
    
        })

  2. #2
    Sencha User
    Join Date
    Dec 2012
    Posts
    5
    Vote Rating
    0
    CrazySerb is on a distinguished road

      0  

    Default


    or should this be done directly in the JSON feed/source itself?

    is there any difference in speed if the JSON feed is rewritten in PHP vs. the calculations being done on the frontend, through ExtJS?

  3. #3
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,909
    Vote Rating
    626
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  4. #4
    Sencha User
    Join Date
    Dec 2012
    Posts
    5
    Vote Rating
    0
    CrazySerb is on a distinguished road

      0  

    Default


    #1 - I kinda get it... I can assign it to Model fields, but how do I assign that actual converted value to the columns in the grid now for each entry?

  5. #5
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,909
    Vote Rating
    626
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    Create a new field in your model called ROI, then specify the convert method, it will just act as a normal field.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  6. #6
    Sencha User
    Join Date
    Dec 2012
    Posts
    5
    Vote Rating
    0
    CrazySerb is on a distinguished road

      0  

    Default


    did... got it working, kinda.

    now trying to figure out how to make the new ROI field sortable... have this in Ext.data.Model:

    {name: 'ROI', type: 'int', sortable: true, sortType: 'int'}

    and this in Column view:


    { header: 'ROI', renderer: returnROI, width: 50, sortable: true, sortType: 'int'},

    (calling helper function returnROI that returns the calculated ROI)

    ideas?

    current setup isn't sortable...

  7. #7
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,909
    Vote Rating
    626
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    Read what I said above:

    Create a new field in your model called ROI, then specify the convert method, it will just act as a normal field.
    Also, you're duplicating configs. sortType only goes on the model, sortable only goes on the column.
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

  8. #8
    Sencha User
    Join Date
    Dec 2012
    Posts
    5
    Vote Rating
    0
    CrazySerb is on a distinguished road

      0  

    Default


    ok, did that, and no luck... unless I am missing something.

    here's what I got:

    Code:
    	function convROI(v, record){
    		return record.get('Revenue')/record.get('Spend');
    	}
    
    		Ext.define('Placements', {
    			extend: 'Ext.data.Model',
    			fields: [
    				...
    				{name: 'ROI', convert: convROI, sortType: 'int', type: 'int'},
    			]
    		});
    
    
    ...
    ...
    columns: [
    		{ header: 'ROI', renderer: calcROI, width: 50},
    	  ]

Thread Participants: 1