The application code

The application code for this chapter will create a pop-up window that will open when a grid row is double-clicked or when the when the add button on the toolbar is pressed. Once the pop-up window is created we do not want to recreate it again; so we will only hide and show it. To prevent the pop-up window from closing when the close button is pressed we will use the onClose event we discussed in the previous section.

Creating the pop-up window

Open the app.js file and add the following code at the end:

// Popup
var appPopup;
dhtmlxEvent(window, "load", function(){
   // create popup
   var win = new dhtmlXWindows();
   win.setImagePath(config.imagePath);
   appPopup = win.createWindow(1,null,null,400,300);
   appPopup.setText("User Add/Edit");
   appPopup.centerOnScreen();
   // popup events
   appPopup.attachEvent("onClose",callbacks.hidePopup);
   // hide popup initially
   appPopup.hide();
});

First we created the global variable as a reference to the pop-up window....