1. #1
    Ext JS Premium Member
    Join Date
    Dec 2011
    Location
    India
    Posts
    193
    Answers
    7
    Vote Rating
    3
    rpoddar is on a distinguished road

      0  

    Default Unanswered: Custom grid rendering in SMVC extjs4

    Unanswered: Custom grid rendering in SMVC extjs4


    For our application we came up custom grid component by extending Ext.grid.Panel
    But while using custom grid in MVC rendering sequence got changed.
    Because of this expand and collapse row is throwing "nextBd is null" error


    Rendering sequence using custom grid :

    1. custom grid
    2. plugins
    3. view port

    Correct rendering sequence should be

    1.view port
    2.plugin
    3. custom grid

    Any idea for rendering the correct sequence .
    Code:
    ---------------------------Custom grid------------------------------
    Ext.require([
        'Ext.grid.*'
    ]);
    Ext.define('Custom.WrapperGridPanel', {
           extend          :'Ext.grid.Panel',
          border: true,
           
          
            initComponent: function() {
            	   
    	       	var config = {
    	       	};
    	       	alert('xx1');
    	       this.buildConfig(config);
    	       Ext.apply(this, Ext.apply(this.initialConfig, config));
    	
    	       var me = this;
    		   me.callParent(arguments);
           },
            
           buildConfig: function(config) {
        	   alert('xx');
               	this.buildSelType(config);
           		this.buildStore(config);
           		this.buildViewConfig(config);
           		this.buildColumns(config);
           		this.buildPlugins(config);
           		this.buildFeatures(config);
           		this.buildTbar(config);
           		this.buildBbar(config);
           },
           buildPlugins : function(config) {
        	       
           },more code for custom grid 
    ---------------------------Custom grid------------------------------
    
    ----------------------------Main grid  using custom grid ---------------------
    
    
    Ext.require([
             	
             	'TPApp.store.AttributeStore',
             	'TPApp.store.TPStore'
             	
             	
             ]);
    
    
    Ext.define('TPApp.view.MainGrid', {
                 extend   : 'Custom.WrapperGridPanel',
                 alias    : 'widget.MainGrid',
                 stores   : ['TPStore','AttributeStore','WeightStore'],
                 id:'mainGrid',
                 autoWidth:true,
                 autoScroll:true,
                 renderTo : Ext.getBody(),
                 initComponent: function() {
                 	console.log("MainGrid initComponent called.");
                     var me = this;
                    
                   // nested grid start //
                    me.callParent(arguments);
    
    
                     me.getView().on('expandbody', function(node, record, eNode) {
             	var element = Ext.get(eNode).down('.ux-row-expander-box');
             	 // alter the fields (swap the model data index with the child data index)
                         var attributeType = record.get("name");
                         alert("attributeType"+attributeType);
                        var grid ='';
                       if(attributeType === "Severity") {
                       } else if (attributeType === "Src IP") {
                      } else {
                          Ext.Msg.alert('please select the attribute type !');
             			  return 
                       }
                         Ext.apply(grid, me.expandable);
                         grid.on('itemclick', function(view) {
                             me.getView().getSelectionModel().deselectAll();
                         });
                         
                         element.swallowEvent(['click', 'mousedown', 'mouseup', 'dblclick'], true);
                         grid.render(element);
                     });
                     me.getView().on('collapsebody', function(node, record, eNode) {
                         Ext.get(eNode).down('.ux-row-expander-box').down('div').destroy();
                     });
                     
                     // nested grid end //
                 },buildPlugins : function(config) {
              	   config.plugins = [
             	           {
             			       ptype: 'RowExpander',
             			        rowBodyTpl: ['<div class="ux-row-expander-box"></div>'],
             			        expandOnRender: true,
             			        expandOnDblClick: false
                            },
                            
    	                        Ext.create('Ext.grid.plugin.CellEditing', {
    	                             clicksToEdit: 1,
    	         			        listeners: {
    	         					    edit: function(){
    	         						   // refresh summaries
    	         					      
    	         						   Ext.getCmp('mainGrid').getView().refresh();
    	         					    }
    	         			        } 
    	                       })
                           
                           
              	   ]
                 }, // more code for main grid 
    
    ----------------------------Main grid using custom grid ---------------------

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    35,731
    Answers
    3362
    Vote Rating
    754
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Is it only because of the plugin?
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Ext JS Premium Member
    Join Date
    Dec 2011
    Location
    India
    Posts
    193
    Answers
    7
    Vote Rating
    3
    rpoddar is on a distinguished road

      0  

    Default


    we don`t know the issue is with plugin or WrapperGridPanel


    But we are suspecting WrapperGridPanel is the culprit,because if we use Ext.grid.panel rendering happening correctly.

    we extended Ext.grid.Panel to WrapperGridPanel (see the below code )


    Question is :


    1. WrapperGridPanel is the correct way are not ( please see the below code ) Does MVC supports
    extended grid ?


    can u please give sample example of extending the grid with overriding options like
    below WrapperGridPanel


    Thx
    Vin

  4. #4
    Ext JS Premium Member
    Join Date
    Dec 2011
    Location
    India
    Posts
    193
    Answers
    7
    Vote Rating
    3
    rpoddar is on a distinguished road

      0  

    Default Sorry for misleading there is problem with rowexpander plugin nextBd is null

    Sorry for misleading there is problem with rowexpander plugin nextBd is null


    Yes the problem is with row expander plugin , we extended Ext.grid.Panel to WrapperGridPanel

    and started using WrapperGridPanel as super class , but row expander plugin throws

    nextBd is null
    https://localhost/js/extJS/ux/RowExpander.js
    Line 205

    you can find the code in below mail thread .

    Thx
    Vin

Thread Participants: 1

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar