Book Image

Learning DHTMLX Suite UI

By : Eli Geske
Book Image

Learning DHTMLX Suite UI

By: Eli Geske

Overview of this book

JavaScript applications provide an excellent user experience for small to large scale enterprise applications. The amazing growth of JavaScript has opened the door for many great libraries such as DHTMLX. "Learning DHTMLX Suite UI" will teach you how to use these libraries effectively so you can make presentations that will take your employer's/ client's breath away! "Learning DHTMLX Suite UI" is a step-by-step guide that will teach you the basics of DHTMLX library components and how to apply them in a real-world scenario. This book will start with the installation of DHTMLX before moving on to explore the features of DHTMLX and helping you to create your first user management application. "Learning DHTMLX Suite UI" will guide you through the installation of DHTMLX as a single-page application. As you progress from one chapter to the next, you will gradually build a simple user management application. You will also learn how to create forums with validation and how to use grids to add and edit users. The book will also suggest the best practices for using toolbars and refreshing data. With "Learning DHTMLX Suite UI Guide", you will be inspired to come up with your own great ideas for your future application development projects.
Table of Contents (17 chapters)
Learning DHTMLX Suite UI
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Layout events


Events in JavaScript are very useful when creating applications. DHTMLX has provided many different events for each of the components. We will go over how to attach and detach one of the events to give us an idea of how we can utilize them.

The more common events for the layout object are onResizeFinish, onExpand, onCollapse, and onDblClick. Let's take a look at onResizeFinish.

We will use the same layout we created in previous sections to attach this event.

attachEvent and detachEvent

DHTMLX provides the attachEvent and detachEvent methods.

The first parameter when attaching an event is the name of the event you want to attach. The second is a handler method, which is the method that will fire when the event triggers.

Type and run the following code:

var myEventId = myLayout.attachEvent("onResizeFinish", function(){
   console.log("Layout Resized"); 
});

Now if you resize the browser window you will see a console entry stating Layout Resized.

In most cases the DHTMLX event will pass...