E-book details

Learning DHTMLX Suite UI. Create your first single-page JavaScript application using multiple DHTMLX components and a touch of HTML5

Learning DHTMLX Suite UI. Create your first single-page JavaScript application using multiple DHTMLX components and a touch of HTML5

Eli Geske

Ebook
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.
  • Learning DHTMLX Suite UI
    • Table of Contents
    • Learning DHTMLX Suite UI
    • Credits
    • About the Author
    • About the Reviewers
    • www.PacktPub.com
      • Support files, eBooks, discount offers, and more
        • Why Subscribe?
        • Free Access for Packt account holders
    • Preface
      • What this book covers
      • What you need for this book
      • Who this book is for
      • Conventions
      • Reader feedback
      • Customer support
        • Downloading the example code
        • Errata
        • Piracy
        • Questions
    • 1. User Management Web App
      • About DHTMLX
        • DHTMLX and other component libraries
        • The components
      • What will we be building?
      • Summary
    • 2. Download, Setup, and Test
      • Installing a web server
      • Creating the application directory structure
      • Downloading the DHTMLX library
      • Creating the application file app.js
      • The data storage file
      • Creating the index.html file
      • Testing the DHTMLX installation
      • Summary
    • 3. Data Structures, Storage, and Callbacks
      • localStorage
      • Creating the storage object
        • The storage methods and properties
          • lastStoredId
          • setDateFormat
        • The user methods
          • The user model
          • createUser
            • The user parameter
          • getUser
          • updateUser
          • removeUser
        • The grid methods
          • The grid JSON data structure
          • gridRow
          • getUserGrid
        • The chart methods
          • barChartItem
          • createUserBarChart
        • The storage object
      • The callbacks object
      • Summary
    • 4. The DHTMLX Layout
      • The DHTMLX layout
      • The methods and events
        • Initialization
        • Methods
          • Cell sizing
          • setHeight
          • setWidth
          • fixSize
          • Cell header
            • showHeader and hideHeader
            • setText
          • progressOn and progressOff
        • Overview of methods
      • Layout events
        • attachEvent and detachEvent
      • dhtmlxEvent
      • The application code
        • Create the layout
      • Summary
    • 5. The DHTMLX Toolbar
      • The DHTMLX toolbar
      • The methods and events
        • Initialization choices
        • Initialization on a DOM element
        • Initialization on a layout object
        • Initialization on a cell object
        • Toolbar items
          • addButton
          • addButtonTwoState
          • getItemState
          • addSeparator
          • addText
          • addButtonSelect
          • getListOptionSelected
          • addSpacer
          • removeSpacer
          • addSlider
          • addInput
          • getValue
          • hideItem and showItem
          • removeItem
        • Toolbar events
          • onClick
          • onValueChange
          • onStateChange
          • onEnter
      • The application code
        • Creating the toolbar
      • Summary
    • 6. The DHTMLX Grid
      • The DHTMLX grid
      • The grid methods and events
        • Initialization choices
          • Initialization on a DOM element
          • Initialization on a cell object
        • Grid methods
          • attachGrid
          • setImagePath
          • setHeader
          • setInitWidths
          • setColAlign
          • init
          • addRow
          • setColTypes
          • getSelectedRowId
          • clearSelection
          • clearAll
          • parse
        • Grid events
          • onRowDblClicked
          • onRowSelect
      • The application code
        • Create the grid
        • callbacks.setToolbarItemStates
        • callbacks.removeClick
        • callbacks.refreshGrid
        • callbacks.dataChanged
      • Testing the grid
        • Creating a user
        • Removing a user
      • Summary
    • 7. The DHTMLX Window
      • The DHTMLX window
      • The methods and events
        • Initialization
          • Creating the base object
          • Create windows through methods
        • Methods
          • createWindow (base object method)
          • setDimension
          • denyResize
          • centerOnScreen
          • setModal
          • hide
          • show
          • setText
          • hideHeader
          • showHeader
        • Events
          • onClose
      • The application code
        • Creating the pop-up window
        • callbacks
          • showPopup
          • hidePopup
          • addClick
      • Test our popup
      • Summary
    • 8. The DHTMLX Form and Calendar
      • The DHTMLX form
      • Initialization of the DHTMLX form
        • attachForm
          • Form items and attributes
            • settings
            • input
            • hidden
            • checkbox
            • calendar
            • select
            • button
            • block
            • newcolumn
        • Form methods
          • setItemFocus()
          • validate()
          • clear()
          • enableLiveValidation()
          • setFormData()
          • getFormData()
      • The application code
        • app.js
          • callbacks
          • showPopup()
          • hidePopup()
          • editClick()
          • Edit the CSS form
          • index.html
      • Test the application form
      • Summary
    • 9. The DHTMLX Chart
      • The methods and events
        • Initialization of the DHTMLX chart
        • dhtmlXChart()
        • addChart()
        • Methods
          • refresh()
          • add()
          • define()
            • Define a series
            • Define chart type
          • addSeries()
          • idByIndex()
          • get()
        • Events
          • onItemClick
      • The application code
        • Creating the chart
        • callbacks.refreshChart()
        • callbacks.dataChanged()
      • Test the application
      • Summary
    • 10. The Finish Line
      • Testing
        • Troubleshooting
      • More features
        • Server side
        • Adding icons
        • Event tweaks
        • Chart ideas
      • Summary
    • Index
  • Title: Learning DHTMLX Suite UI. Create your first single-page JavaScript application using multiple DHTMLX components and a touch of HTML5
  • Author: Eli Geske
  • Original title: Learning DHTMLX Suite UI. Create your first single-page JavaScript application using multiple DHTMLX components and a touch of HTML5
  • ISBN: 9781849699341, 9781849699341
  • Date of issue: 2013-10-25
  • Format: Ebook
  • Item ID: e_3cw0
  • Publisher: Packt Publishing