Unable to display Quick Tips

Posted in xn--kfs74mzzid01b.com edit by cfz on January 8th, 2009

Hi,
I'm unable to display QuickTip for Grid Panels.

Following is the code to show in Ext.onReady():

Ext.QuickTips.init();

// Creating the GridPanel
var resultsGridPanel = new Ext.grid.GridPanel
({
id: 'resultsGridPanel',
store: store,
cm: new Ext.grid.ColumnModel
([
new Ext.grid.RowNumberer(),
{header: "Session ID", width: 20, sortable: true, resizable: true, dataIndex: 'sessionDisplayID'},
{header: "Session Name", width: 50, sortable: true, resizable: true, dataIndex: 'sessionName'},
{header: "# of Attendees", width: 20, sortable: true, resizable: false, align: 'center', dataIndex: 'attendeeCount'},
{header: "View", width: 20, sortable: true, resizable: false, renderer: applyBlueLink, align: 'center', dataIndex: 'viewAttendees'}
]),
viewConfig:
{
forceFit:true
},
width: 600,
height: 350,
title: 'Session Population Report:',
autoScroll: true,
stripeRows: true,
renderTo: Ext.get('divResults'),
sm: new Ext.grid.RowSelectionModel(),
listeners:
{
cellclick: function(grid, rowIndex, colIndex)
{
if(colIndex == 4)
{
var record = grid.getStore().getAt(rowIndex); // Get the Record
var fieldName = grid.getColumnModel().getDataIndex(1); // Get field name
var sessionDisplayID = record.get(fieldName); // Get field value
var sessionID = sessionIDs[rowIndex];
document.getElementById(getNetuiTagName('attendeeP erSessionForm')).action = '/cce/admin/conference/reports/sessionAttendee.do?sessionID=' + sessionID + "&sessionDisplayID=" + sessionDisplayID;
document.getElementById(getNetuiTagName('attendeeP erSessionForm')).submit();
}
}
}
});

Ext.QuickTips.init();

// Creating the GridPanel
var resultsGridPanel = new Ext.grid.GridPanel
({
id: 'resultsGridPanel',
store: store,
cm: new Ext.grid.ColumnModel
([
new Ext.grid.RowNumberer(),
{header: "Session ID", width: 20, sortable: true, resizable: true, dataIndex: 'sessionDisplayID'},
{header: "Session Name", width: 50, sortable: true, resizable: true, dataIndex: 'sessionName'},
{header: "# of Attendees", width: 20, sortable: true, resizable: false, align: 'center', dataIndex: 'attendeeCount'},
{header: "View", width: 20, sortable: true, resizable: false, renderer: applyBlueLink, align: 'center', dataIndex: 'viewAttendees'}
]),
viewConfig:
{
forceFit:true
},
width: 600,
height: 350,
title: 'Session Population Report:',
autoScroll: true,
stripeRows: true,
renderTo: Ext.get('divResults'),
tooltip: 'hello',
sm: new Ext.grid.RowSelectionModel(),
listeners:
{
cellclick: function(grid, rowIndex, colIndex)
{
if(colIndex == 4)
{
var record = grid.getStore().getAt(rowIndex); // Get the Record
var fieldName = grid.getColumnModel().getDataIndex(1); // Get field name
var sessionDisplayID = record.get(fieldName); // Get field value
var sessionID = sessionIDs[rowIndex];
document.getElementById(getNetuiTagName('attendeeP erSessionForm')).action = '/cce/admin/conference/reports/sessionAttendee.do?sessionID=' + sessionID + "&sessionDisplayID=" + sessionDisplayID;
document.getElementById(getNetuiTagName('attendeeP erSessionForm')).submit();
}
}
}
});

Panel, the grid inherits from, has no config property tooltip. If you want tooltip on title do it like this:

.... title:'Your title'

Where do you want to display quick tips? I haven't found any "qtip" or "tip" or "tooltip" word in your code.

could I put the QuickTips for each of the column headers by putting something like this: 'column A:' as header values for each column ?

For column headers there is a quicktip config option called "tooltip". Read the docs for Ext.grid.ColumnModel and you will learn how to set a tooltip for each column.

#If you have any other info about this subject , Please add it free.#

Unable to display Quick Tips

Archives

Meta