PDA

View Full Version : Import Excel to Grid



joethu
15 Sep 2009, 7:54 PM
Instead of doing this in back-end, I prefer to load excel into Grid directly and let user have a preview and editing before sending back to server.

I find Animal's extension doing the excel export but didn't find any thread about importing, neither even in other forums and Google. I doubt if there's something wrong with my requirement?

Any clues are appreciated.

Animal
15 Sep 2009, 9:47 PM
VinylFox came up with a good idea which I added some suggestions to. Drag from Excel and drop into a Grid: http://www.extjs.com/forum/showthread.php?t=79511

19 Nov 2009, 8:40 AM
Hi All,
Is there anyway to import MS Excel into editor grid, the way google docs works.
Please suggest us how to do
Thanks,
Anubhav

VinylFox
19 Nov 2009, 9:05 AM
...Is there anyway to import MS Excel into editor grid, the way google docs works.
Please suggest us how to do...

If your referring to the File->Import feature in Google Docs, that is just a simple file upload with the data being parsed on the server and pushed back out to the grid. Fairly standard implementation, nothing to write home about.

Thomas Triplet
19 Nov 2009, 11:32 AM
@VinylFox I was wondering whether your extension could be adapted to catch the [CTRL]+v event so that we can copy/paste instead of dragging/dropping

23 Nov 2009, 8:54 AM
Thanks for a prompt reply.
Actually I am looking to embed MS-Excel into EXT using Panel or grid which helps the user to work on excel within our application.

Mycoding
4 Jul 2010, 12:05 AM
Excuse me, I didn't get is the way to show data ingrid from excel?

anpegar
29 Sep 2011, 2:13 AM
Hi folk,
I’m used the plugin with EditorGridPanel (version ExtJS 3.3) and iExplorer 7 or superior but I have a error in override.js file line 46 (“this.dom.fireEvent(e, evt);”), the error occurs when I click a cell, with propertie editable=true, and after click a other cell into grid.

Any idea?
Thanks in advance.



/**
* @author Nigel (Animal) White
* @contributor Shea Frederick - http://www.vinylfox.com
* <p>Override to allow mouse event forwarding through masking layers - .</p>
*/
Ext.override(Ext.Element, (function(){
var doc = document,
SCROLLLEFT = 'scrollLeft',
SCROLLTOP = 'scrollTop',
HTMLEvts = /^(scroll|resize|load|unload|abort|error)$/,
mouseEvts = /^(click|dblclick|mousedown|mouseup|mouseover|mouseout|contextmenu|mousenter|mouseleave)$/,
UIEvts = /^(focus|blur|select|change|reset|keypress|keydown|keyup)$/,
onPref = /^on/;


function getScroll() {
var dd = doc.documentElement,
db = doc.body;
if(dd && (dd[SCROLLTOP] || dd[SCROLLLEFT])){
return [dd[SCROLLLEFT], dd[SCROLLTOP]];
}else if(db){
return [db[SCROLLLEFT], db[SCROLLTOP]];
}else{
return [0, 0];
}
}


return {
/**
* Fires an event through this Element.
* @param e {String} Event name. eg: 'mousedown'.
* @param initializer {Function
*/
fireEvent: Ext.isIE ? function(e, evtInitializer) {
var evt;
e = e.toLowerCase();
if (!onPref.test(e)) {
e = 'on' + e;
}
if (Ext.isFunction(evtInitializer)) {
evt = document.createEventObject();
evtInitializer(evt);
} else {
evt = evtInitializer;
}


this.dom.fireEvent(e, evt); // Here is the error.

} : function(e, evtInitializer) {
var evt;
e = e.toLowerCase();
e.replace(onPref, '');
if (mouseEvts.test(e)) {
var b = {};
if (this.getBox) {
b = this.getBox();
} else {
b.width = this.getWidth();
b.height = this.getHeight();
b.x = this.getX();
b.y = this.getY();
}
var x = b.x + b.width / 2,
y = b.y + b.height / 2;
evt = document.createEvent("MouseEvents");
evt.initMouseEvent(e, true, true, window, (e=='dblclick')?2:1, x, y, x, y, false, false, false, false, 0, null);
} else if (UIEvts.test(e)) {
evt = document.createEvent("UIEvents");
evt.initUIEvent(e, true, true, window, 0);
} else if (HTMLEvts.test(e)) {
evt = document.createEvent("HTMLEvents");
evt.initEvent(e, true, true);
}
if (evt) {
if (Ext.isFunction(evtInitializer)) {
evtInitializer(evt);
}
this.dom.dispatchEvent(evt);
}
},


/**
* Forwards mouse events from a floating mask element to the underlying document.
*/
forwardMouseEvents: function(evt) {
var me = this,
xy, t, lastT,
evts = [ 'mousemove', 'mousedown', 'mouseup', 'dblclick', 'mousewheel' ];


me.on('mouseout', function() {
if (lastT) {
Ext.fly(lastT).fireEvent('mouseout');
lastT = null;
}
});


for (var i = 0, l = evts.length; i < l; i++) {
this.on(evts[i], function(e) {
var s = (Ext.isGecko) ? getScroll() : [0, 0],
be = e.browserEvent,
x = Ext.num(be.pageX, be.clientX) - s[0],
y = Ext.num(be.pageY, be.clientY) - s[1],
et = be.type,
t;


if (!me.forwardingSuspended && me.isVisible()) {
e.stopPropagation();
me.forwardingSuspended = true;
me.hide();
t = Ext.get(document.elementFromPoint(x, y));
me.show();
if (!t) {
lastT.fireEvent('mouseout');
lastT = t;
delete me.forwardingSuspended;
return;
}
if (t === lastT) {
if (et == 'mouseup') {
t.fireEvent('click');
}
} else {
if (lastT) {
lastT.fireEvent('mouseout');
}
t.fireEvent('mouseover');
}
if (et !== 'mousemove') {
if (t.dom.fireEvent) {
t.fireEvent(et, be);
} else {
e = document.createEvent("MouseEvents");
e.initMouseEvent(et, true, true, window, be.detail, be.screenX, be.screenY, be.clientX, be.clientY,
be.ctrlKey, be.altKey, be.shiftKey, be.metaKey, be.button, null);
t.dom.dispatchEvent(e);
}
}
lastT = t;
delete me.forwardingSuspended;
}
});
}
}
};
})());