PDA

View Full Version : Couldnt get working colorbox with grid



omegafox
21 May 2009, 8:41 AM
Hey! It has been while that I requested to help. I am trying to get work with colorbox(lightbox-like) with this grid. It didnt went to "colorbox" page because it was opening a new window. If you are wondering why not use lightbox that already have set up with extjs, it dont have script that works with flash,html, and iframe. So I am using Colorbox(http://colorpowered.com/colorbox/). it is working fine in plain html. But I couldn't get it working with extjs grid by using rendering. I tried to use "onclick:javascript", still no luck. I tried to do different method with "cellclick", still no luck. So can you tell what did I missing or does it will allow works with colorbox or not?


var myDataStore = new Ext.data.GroupingStore({
proxy:new Ext.data.HttpProxy({url:'FAKE'}),
baseParams:{task:"FAKE"},
reader:myReader,
sortInfo:{field:'user',direction:'ASC'},
//remoteSort:true,
groupField:'course',
});
var getColumnModelGrid = function(){
if(!ColumnModelGrid) {

function checkprint2(val){
if(val == 1)
return <a href="http://google.com"> <img src="icons/printer.png" /> </a>';
else
return '<img src="icons/cross.png" alt="N" border="0"/>';
};

ColumnModelGrid = new Ext.grid.ColumnModel(
[{
header: 'Course',
readOnly: true,
dataIndex: 'course',
width: 70,
hidden: true

},{
header: 'Print',
readOnly: true,
dataIndex: 'ACTIVE',
width: 16,
align: 'center',
hidden: false,
renderer: checkprint2
}]);
}
return ColumnModelGrid;

}//end getColumnModel
var grid = new xg.GridPanel({
id:'my-grid',
autoSizeColumns:true,
store:myDataStore,
colModel:getColumnModelGrid(),
sm: new Ext.grid.RowSelectionModel({singleSelect: true}),
view: new Ext.grid.GroupingView({
forceFit:true,
startCollapsed: true
}),
frame:true,
width: 1100,
height: 450,
titleCollapse : true,
loadMask:true, collapsible: false,
animCollapse: true,
title: 'Grouping Example',
iconCls: 'icon-grid',
renderTo: document.body
});
grid.on('cellclick', function(grid, rowIndex, colIndex) {
var rowRecord = grid.getSelectionModel().getSelected();
if (typeof rowRecord != 'object')
return false;
PrintID = rowRecord.get('ACTIVE');
rowRecord = '';
if(colIndex == 6 && PrintID == 1)
{
//<a href="http://google.com"> <img src="icons/printer.png" /> </a>;
//Ext.MessageBox.alert('OK','IT WORKED!!! :)');


});
grid.addListener('afteredit', handleEdit);//give event name, handler (can use 'on' shorthand for addListener)

function handleEdit(editEvent) {
var gridField = editEvent.field;
updateDB(editEvent);

}
myDataStore.load({params:{start:0,limit:2000}});

});