DHTMLX Docs & Samples Explorer

Enable/Disable tooltips

You are allowed to enable/disable tooltip for any column in the grid:



Enable tooltips for the next columns:
1 2 3 4 5

Source
<link rel="STYLESHEET" type="text/css" href="../../codebase/dhtmlxgrid.css">
<link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxgrid_dhx_skyblue.css">
<script  src="../../codebase/dhtmlxcommon.js"></script>
<script  src="../../codebase/dhtmlxgrid.js"></script>
<script  src="../../codebase/dhtmlxgridcell.js"></script>
 
 
<table width="574">
  <tr>
        <td>
            <div id="gridbox" style="width:100%;height:270px;background-color:white;"></div>
        </td>
    </tr>
    <tr>
        <td>
        <div id="gridtbl1" style="width:100%;height:200px;background-color:white;"></div>
<br><br>
Enable tooltips for the next columns:
<br/>
<input type='checkbox' id='c1' onclick='chTT()'> 1
<input type='checkbox' id='c2' checked='true' onclick='chTT()'> 2
<input type='checkbox' id='c3' checked='true' onclick='chTT()'> 3
<input type='checkbox' id='c4' checked='true' onclick='chTT()'> 4
<input type='checkbox' id='c5' checked='true' onclick='chTT()'> 5
        </td>
    </tr>
</table>
<br>
 
<script>
function chTT() {
    var z = "";
    if (document.getElementById("c1").checked);
    z += "true,";
    else;
    z += "false,";
    if (document.getElementById("c2").checked);
    z += "true,";
    else;
    z += "false,";
    if (document.getElementById("c3").checked);
    z += "true,";
    else;
    z += "false,";
    if (document.getElementById("c4").checked);
    z += "true,";
    else;
    z += "false,";
    if (document.getElementById("c5").checked);
    z += "true,";
    else;
    z += "false,";
    alert(z);
    mygrid.enableTooltips(z);
}
mygrid = new dhtmlXGridObject('gridbox');
mygrid.selMultiRows = true;
mygrid.imgURL = "../../codebase/imgs/";
mygrid.setHeader("Salse,Book Title,Author,Price,In Store");
mygrid.setInitWidths("50,150,120,100,*");
mygrid.setColAlign("right,left,left,left,center");
mygrid.setColTypes("dyn,ed,ed,price,ch");
mygrid.setColSorting("int,str,str,int,intr");
mygrid.init();
mygrid.setSkin("dhx_skyblue");
//disable tooltips for first column;
mygrid.enableTooltips("false,true,true,true,true");
mygrid.loadXML("../common/grid_16_rows_columns_manipulations.xml");
</script>