Check documentation for the latest version of dhtmlxSuite getPopup DHTMLX Docs

getPopup

returns dhtmlXPopup instance which was initialized for tooltips

dhtmlXPopup getPopup();
dhtmlXPopupdhtmlXPopup instance or null

Example

// we do not recommend using such constructions in your linear code
// popup is initialized after the user hovers over any  
// date with attached tooltip at least once
var myPop = myCalendar.getPopup(); 
 
// the best way if you plan to attach "heavy" content like grid
// there's no need to specify the 2nd arg - text, only if "loading..."
var lastDate = null;
var myPop = null;
var myGrid = null;
 
myCalendar.setTooltip("2013-01-01", "Loading...", true, true);
 
myCalendar.attachEvent("onPopupShow", function(date){
    // inside of the event handler 'this' points to myCalendar
 
    // save popup date if a user will move mouse away while response goes to the server
    lastDate = this.getFormatedDate("%Y-%m-%d", date); 
 
    // load heavy content from server
    window.dhx.ajax.get("server.php?date="+lastDate, function(r){
        // assuming that response was the following (in json format):
        {state: true, date: "2013-01-01", gridConf: {...} }
 
        // date param the same as was in request
        var t = null;
        try { eval("t="+r.xmlDoc.responseText); } catch(e){};
        if (t != null && lastDate != null && t.state == true && lastDate == t.date) {
            if (!myPop) myPop = myCalendar.getPopup(); // we need it once
            myGrid = myPop.attachGrid();
            myGrid.load(t.gridConf, "json"); // or something like
        }
    });
});
 
myCalendar.attachEvent("onPopupHide", function(){
    if (myGrid != null) {
        // unload the grid
        myPop.clear();
        myGrid = null;
    }
    // clear date, we will check it in the callback (above) 
    // to make sure the popup is still visible
    lastDate = null; 
});
 
// you can also skip grid reinit and just use grid.updateFromXML

Details
  • to be 100% sure that the popup is inited when you call getPopup(), we added onPopupShow event. It will fire every time the tooltip becomes visible. You can attach any content into it.

  • almost the same logic can be used to show popups over cells. But instead of tooltips and "onPopupShow" you can use onMouseOver/onMouseOut events, init popup manually and getCellDimension to determine the cell's x,y (where to show the popup).

Back to top