qtip with autohide disabled in a xml-grid

[BaminiPrakash]

Hi,

I am using ext-js xml-grid and qtip. xml-grid has come well as per my requirement. I am trying to use the quicktips from ext-js examples. for some reason the style sheet or image is not working. I am trying to use the sutohide disabled with closable true.

my code is:
{header: "<font size='2'><b>Status Reason</b></font>", width: 116, dataIndex: 'StatusReason', sortable: true,id:'StatusReason',
renderer: function (pValue,pCell) {
pCell.attr += ' ext:qtip="' + pValue + '"' + 'ext:hide=false' ;
return pValue;
}

I am not able to bring the close button in the example. the example itself is not working in my local. it is working only in ext-js site. please let me know how i bring that color and close button in tip2 style. the above is a dynamice code.
the static example code is

new Ext.ToolTip({
target: 'tip2',
html: 'Click the X to close me',
title: 'My Tip Title',
autoHide: false,
closable: true,
draggable:true
});
<style type="text/css">
.tip-target {
width: 100px;
text-align:center;
padding: 5px 0;
border:1px dotted #99bbe8;
background:#dfe8f6;
color: #15428b;
cursor:default;
margin:10px;
font:bold 11px tahoma,arial,sans-serif;
float:left;
}
</style>
<div id="tip2" class="tip-target">autoHide disabled</div>

how do i make this as dynamice in xml-grid.js for a data from xml file.

Thanks
Bamini

[Condor]

You could use:

Ext.QuickTip.prototype.closable = true;
Ext.QuickTips.init();

but this will enable the close button for all quicktips.

If you don't want that, then you should use a separate ToolTip for your cell tip (try Animal's DataTip user extension).

[BaminiPrakash]

sencha_pic.JPG

Hi Condor,

Hope you can view the above picture. I think I am missing some styles. I don't get the same color or the 'x' button for close. After I added your code, I can see that the hyperlink symbol appears when I move the mouse to that place but not seeing the x button.

Can you help me to find that code?

Thanks
Bamini

[Condor]

Sorry, but my eyes aren't THAT good! Can you post the image again (but a little bigger this time)?

[BaminiPrakash]

Sorry, but my eyes aren't THAT good! Can you post the image again (but a little bigger this time)?

secha.JPG

Hope this is clear..

[Animal]

Getting any 404s in Firebug's Net tab?

[BaminiPrakash]

No i do not get any 404. only thing is the x button not appearing.

[Animal]

No images are appearing.

You either have your images 404ing, or you have an incorrect stylesheet.

Tooltips do not look like that.

Check that tooltip's styling using Firebug, and see why it is not styled with framing images.

[BaminiPrakash]

Hi

my sample is working now. i found it is due to the ext-all.css placed in worng dir.

now i would like to know how to change

<div id="tip2" class="tip-target">autoHide disabled</div>

to

pCell.attr += ' ext:qtip="' + pValue + '"' + 'ext:hide=false' ; - this is the only code i use to get tooltip in xml-grid.js file i need tooltip for a single column.

how do i give

<style type="text/css">
.tip-target {
width: 100px;
text-align:center;
padding: 5px 0;
border:1px dotted #99bbe8;
background:#dfe8f6;
color: #15428b;
cursor:default;
margin:10px;
font:bold 11px tahoma,arial,sans-serif;
float:left;
}
</style>

this style sheet in xml-grid.js and the div tage to converted into pcell.attr = ... or in simple how do i give the class in my ext:qtip line. please help.

Condor - after adding ur code the x button is not appearing but the close is working. i need it exactly as it looks in the example of ext.

i have added
Ext.QuickTip.prototype.closable = true;
Ext.QuickTips.init();
in xml-grid.js initially. only problem is pcell line. tell me how to convert the code.

thanks
Bamini

[BaminiPrakash]

Hi

i tried to put the ext-all.css out of resources dir and that caused the whole problem. now it is working after copying the whole of resources dir to my folder. only thing what i am thinking is to know which all file / gifs are included so i can put them in the same dir instead of placing the whole of resources dir.

any help is appreciated.


thanks
bamini