1. #21
    Sencha - Community Support Team VinylFox's Avatar
    Join Date
    Mar 2007
    Location
    Baltimore, MD
    Posts
    1,501
    Vote Rating
    7
    VinylFox will become famous soon enough VinylFox will become famous soon enough

      0  

    Default


    Quote Originally Posted by Thomas Triplet View Post
    Works nicely, but I'm getting an error message (just added plugins: [Ext.ux.grid.DataDrop] in the grid config)

    Uncaught TypeError: Cannot read property '0' of null at ext-base-debug.js:3482

    The data does appear in the grid, but the data isn't sent to the server (added newRec.markDirty(); in function dataDropped() before adding to the store. The dirty marks do appear as well, but data is still not sent (getting data to be sent using getModifiedRecords) =/
    You sure your using 3.x ? if so, what version exactly?

    If you have an example page with this problem, that would help.

  2. #22

    Default


    Yes, I am using version 3.0.0

    I dont have the page online, but bellow are relevant pieces of code:

    Code:
    Passport.spreadsheet_panel = new Ext.grid.EditorGridPanel( {
    	id: 'spreadsheet_panel',
    	title:"Substrates",
    	iconCls: 'icon-grid',
    	store: Passport.spreadsheet_store,
    	cm: cmSubstrates,
    	bbar: pagingBar,
    	autoExpandColumn: 'substrates_name',
    	view: new Ext.grid.GroupingView( {
    		groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items": "Item"]})'
    	}),
    	region: 'center',
    	layout: 'fit',
    	stripeRows: true,
    	loadMask: true,
    	plugins: filters,
    	autoResize: true,
    	autoScroll: true,
    	clicksToEdit: 1,
    	columnLines: true,
    	
    	//plugins: [Ext.ux.grid.DataDrop],
    	
    	bodyCfg: {
    		cls: 'x-panel-body x-panel-body-with-bbar'
    	}
    });
    
    Passport.Substrate = Ext.data.Record.create( [
    	{ name: 'substrate_id',				type: 'int', allowBlank :false},
    	{ name: 'substrate_name', 			type: 'string', allowBlank :false},
    	{ name: 'comments', 				type: 'string' },
    	{ name: 'version', 				type: 'int' },
    	{ name: 'history', 				type: 'string' }
    ]);
    
    
    var cmSubstrates = new Ext.grid.ColumnModel( [
    	{
    		header: 'Id',
    		width: 35,
    		fixed:true,
    		align: 'center',
    		menuDisabled:true,
    		sortable: true,
    		groupable: false,
    		editable: false,
    		id: 'numberID',
    		dataIndex: 'substrate_id',
    		editor: new Ext.form.NumberField( {
    			allowNegative: false,
    			allowBlank: false,
    			lazyRender: true
    		})
    
    	}, {
    		header: "Substrate Name",
    		sortable: false,
    		groupable: false,
    		width: 300,
    		id: 'substrates_name',
    		dataIndex: 'substrate_name',
    		editor: new Ext.form.TextField( {
    			allowBlank: false,
    			lazyRender: true
    		})
    
    	}, {
    		header: "Version",
    		sortable: false,
    		groupable: false,
    		menuDisabled:true,
    		editable: false,
    		width: 50,
    		fixed:true,
    		align: 'center',
    		id: 'substrates_version',
    		dataIndex: 'version'
    
    	}, {
    		header: "Comments",
    		sortable: false,
    		groupable: false,
    		width: 460,
    		id: 'substrates_comments',
    		dataIndex: 'comments',
    		editor: new Ext.form.HtmlEditor( {
    			height: 250,
    			enableFonts: true,
    			enableLists: false,
    			enableLinks: true,
    			enableAlignments: true,
    			enableColors: true,
    			allowBlank: true,
    			lazyRender: true
    		})
    
    	}
    ]);
    
    
    Passport.spreadsheet_store = new Ext.data.GroupingStore( {
    	storeId: 'Passport.spreadsheet_store',
    	remoteGroup: true,
    	reader: new Ext.data.JsonReader( {
    		root: 'results',
    		idProperty: 'substrate_id',  
    		totalProperty: 'number_records'
    	}, Passport.Substrate),
    	proxy: new Ext.data.HttpProxy({url:'php/jsoner/substrates.php'})
    });
    
    
    // save function, called from button in toolbar
    function saveSubstrates() {
    	var modifiedRecords = Passport.spreadsheet_store.getModifiedRecords();
    	for (var n = 0;n < modifiedRecords.length;n++) {
    		//Ajax call for each modifiedRecords[n]
    	}
    }
    The data is very straight forward, just a spreadsheet with 5 columns, one for each of the fields defined in the Record

    Thanks

  3. #23
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,483
    Vote Rating
    35
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    Quote Originally Posted by Thomas Triplet View Post
    Woww look great!

    Works nicely, but I'm getting an error message (just added plugins: [Ext.ux.grid.DataDrop] in the grid config)

    Uncaught TypeError: Cannot read property '0' of null at ext-base-debug.js:3482


    The data does appear in the grid, but the data isn't sent to the server (added newRec.markDirty(); in function dataDropped() before adding to the store. The dirty marks do appear as well, but data is still not sent (getting data to be sent using getModifiedRecords) =/
    Set it to break on all errors, then see what it's doing there.

  4. #24
    Ext User
    Join Date
    Nov 2008
    Posts
    47
    Vote Rating
    0
    genio is on a distinguished road

      0  

    Exclamation RowEdit + DragDrop issue in IE

    RowEdit + DragDrop issue in IE


    Hi guys,

    I am seeing some strange behavious with the plugin (which is great by the way)

    If I combine it with row editor, once I open up the editor I am unable to select another cell and the caret seems to dissapear to the top cornet of the grid.

    So to reproduce this is what I am doing

    - Double Click on cell to open Editor
    - Cell is selected for edit as expected
    - Move to different cell in the row and selection/focus does not respond
    - I notice a sliglitly visible caret at the top left corner of the grid
    - I am now unable to select any cell anymore...

    Removing the DragDrop plugin will make IE behave as expected with RowEditor

    This is only happening in IE, Firfox behaves as expected with BOTH PLUGINS and the ability to move between cells when the RowEdit is opened.

    Any clues why this is happening? Is it the big layer in drag drop taht makes IE mess up?

    Let me know
    Attached Images

  5. #25
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,483
    Vote Rating
    35
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    I suspect some work will have to be done to hide the masking div on edit start and show it again on edit end.

  6. #26
    Ext User
    Join Date
    Nov 2008
    Posts
    47
    Vote Rating
    0
    genio is on a distinguished road

      0  

    Default


    does DragDrop have access to the grid itself to check this? Was wondering how difficult it is to patch... but only IE has this, Firefox behaves...

  7. #27
    Ext User
    Join Date
    Nov 2008
    Posts
    47
    Vote Rating
    0
    genio is on a distinguished road

      0  

    Default


    I have noticed a bug with this plugin!

    When the textarea is generate on top of the grid, it actually covers and disables the scroll bars...

    I have added the size of the scroll bar to the resize function; which fixes it fixes it.

    Code:
    Ext.ns('Ext.ux.grid');
    /**
     * @author Shea Frederick - http://www.vinylfox.com
     * @contributor Nigel (Animal) White, Andrea Giammarchi & Florian Cargoet
     * @class Ext.ux.grid.DataDrop
     * @singleton
     * <p>A plugin that allows data to be dragged into a grid from spreadsheet applications (tabular data).</p>
     * <p>Requires the Override.js file which adds mouse event forwarding capability to ExtJS</p>
     * <p>Sample Usage</p>
     * <pre><code>
     {
     xtype: 'grid',
     ...,
     plugins: [Ext.ux.grid.DataDrop],
     ...
     }
     * </code></pre>
     */
    Ext.ux.grid.DataDrop = (function () {
    
        var lineEndRE = /\r\n|\r|\n/,
            sepRe = /\s*\t\s*/;
    
        //  After the GridView has been rendered, insert a static transparent textarea over it.
    
    
        function onViewRender() {
            var v = this.view;
            if (v.mainBody) {
                this.textEl = Ext.DomHelper.insertAfter(v.scroller, {
                    tag: 'textarea',
                    id: Ext.id(),
                    value: '',
                    style: {
                        'font-size': '1px',
                        border: '0px none',
                        overflow: 'hidden',
                        color: '#fff',
                        position: 'absolute',
                        top: v.mainHd.getHeight() + 'px',
                        left: '0px',
                        'background-color': '#fff',
                        margin: 0,
                        cursor: 'default'
                    }
                },
                true);
                this.textEl.setOpacity(0.1);
                this.textEl.forwardMouseEvents();
                this.textEl.on({
                    mouseover: function () {
                        Ext.TaskMgr.start(this.changeValueTask);
                    },
                    mouseout: function () {
                        Ext.TaskMgr.stop(this.changeValueTask);
                    },
                    scope: this
                });
                resizeDropArea.call(this);
            }
        }
    
        //  on GridPanel resize, keep scroller height correct to accomodate textarea.
        
        
        function resizeDropArea() {
            if (this.textEl) {
                var v = this.view,
                    sc = v.scroller,
                    scs = sc.getSize,
                    s = {
                    width: sc.dom.clientWidth - v.getScrollOffset() + 2 || (scs.width - v.getScrollOffset() + 2),
                    height: sc.dom.clientHeight - v.getScrollOffset() + 2 || scs.height
                };
                this.textEl.setSize(s);
            }
        }
    
        //  on change of data in textarea, create a Record from the tab-delimited contents.
    
    
        function dataDropped(e, el) {
            var nv = el.value;
            el.blur();
            if (nv !== '') {
                var store = this.getStore(),
                    Record = store.recordType;
                el.value = '';
                var rows = nv.split(lineEndRE),
                    cols = this.getColumnModel().getColumnsBy(function (c) {
                    return !c.hidden;
                }),
                    fields = Record.prototype.fields;
                if (cols.length && rows.length) {
                    for (var i = 0; i < rows.length; i++) {
                        var vals = rows[i].split(sepRe),
                            data = {};
                        if (vals.join('').replace(' ', '') !== '') {
                            for (var k = 0; k < vals.length && k < fields.keys.length; k++) {
                                // var fldName = cols[k].dataIndex;
                                // Change sfunction to support ALL columns rather then just visible ones
                                var fldName = fields.keys[k];
                                var fld = fields.item(fldName);
                                data[fldName] = fld ? fld.convert(vals[k]) : vals[k];
                            }
                            var newRec = new Record(data);
                            newRec.markDirty();
                            store.add(newRec);
                            var idx = store.indexOf(newRec);
                            this.view.focusRow(idx);
                            Ext.get(this.view.getRow(idx)).highlight();
                        }
                    }
                    resizeDropArea.call(this);
                }
            }
        }
    
        return {
            init: function (cmp) {
                Ext.apply(cmp, {
                    changeValueTask: {
                        run: function () {
                            dataDropped.call(this, null, this.textEl.dom);
                        },
                        interval: 100,
                        scope: cmp
                    },
                    onResize: cmp.onResize.createSequence(resizeDropArea)
                });
                cmp.getView().afterRender = cmp.getView().afterRender.createSequence(onViewRender, cmp);
            }
        };
    })();

  8. #28
    Sencha User
    Join Date
    May 2008
    Posts
    262
    Vote Rating
    -4
    mnask79 is infamous around these parts

      0  

    Default


    its really great job

  9. #29
    Ext User
    Join Date
    Oct 2007
    Posts
    19
    Vote Rating
    0
    gillou01 is on a distinguished road

      0  

    Default Contextmenu

    Contextmenu


    Hi Guys
    I m trying to forward also the contextmenu event to my underlying grid.
    So i have added the event in Animal's override :
    Code:
    forwardMouseEvents: function(evt) {
    		var me = this,
                    xy, t, lastT,
                    evts = [ 'mousemove', 'mousedown', 'mouseup', 'dblclick', 'mousewheel','contextmenu' ];
    So the event gets forwarded, but it also triggers the browser context menu to be displayed.
    Anybody know how to prevent that?

    Cheers

  10. #30
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,483
    Vote Rating
    35
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    You have to stop the event (underlying method on the browser event is "preventDefault").

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