dhtmlxscheduler:combo

Nadezhda — 2012-05-15T08:35:46-04:00

Combo Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxscheduler_editors.js; dhtmlxcombo.css, dhtmlxcommon.js, dhtmlxcombo.js This type of editor creates a select box using DHTMLX Combo component.

dhtmlxtree:api_method_dhtmlxtreeobject_seticonsize

Nadezhda — 2012-05-11T08:34:06-04:00

setIconSize(newWidth,newHeight,itemId) Required library edition: [This method requires Professional Edition of the DHTMLX library] Required library file: dhtmlxtree.js set size of icons * newWidth - new icon width in pixels * newHeight - new icon height in pixels * itemId - item Id, if skipped set default value for all new icons, optional

dhtmlxgrid:api_method_dhtmlxgridobject_loadorderfromcookie

Nadezhda — 2012-05-11T04:32:47-04:00

loadOrderFromCookie(name) Required library edition: [This method requires Professional Edition of the DHTMLX library] Required library file: dhtmlxgrid_ssc.js load column order from cookie * name - optional,cookie name mygrid.load("grid.xml",function(){ //minimal parameters set mygrid.loadOrderFromCookie(); //maximal parameters set mygrid.loadOrderFromCookie("some_name"); })

tutorials:tut_quickstart

Nadezhda — 2012-05-08T04:07:52-04:00

Why Should You Read This ? Before working with library, scavenging information from the documentation, checking examples and making up conclusions - consolatory or not – you should read this article. It will take less than 10 minutes, but will save considerably more of your time in the near future. This article is aimed to explain the working logic of library and to provide the basic code examples. In case you intend to go deep into the matter and jump to creating applications you can be sure t…

dhtmlxtoolbar:event_onvaluechange

Nadezhda — 2012-05-07T09:29:46-04:00

onValueChange onValueChange event can be applied to Slider item only. This event calls user-defined handlers (if there are any) and passes the following parameters: * id - id of the item; * value - new value of the item. toolbar.attachEvent("onValueChange", function(id, value){});

dhtmlxconnector:db_operations

Nadezhda — 2012-04-25T06:45:05-04:00

dhtmlxConnector allows to execute some actions against DB. SQL queries DBWrapper object can be accessed as: $connector->sql Then, it can be used in queries in the following way: $connector->sql->query("DELETE FROM some_table WHERE ID=1");//sends a request to execute the specified query //or $res = $connector->sql->query("SELECT * FROM some_table WHERE sale>1550"); while ($data = $connector->sql->get_next($res)) { // doing something with records } //or $connector->sql->query("INS…

dhtmlxwindows:api_method_dhtmlxwindowssngl_getframe - created

Nadezhda — 2012-04-19T09:02:59-04:00

getFrame() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxcontainer.js returns iframe object. This method can be applied to a cell where a page has been loaded by attachURL method.

dhtmlxwindows:api_toc_alpha

Nadezhda — 2012-04-19T09:02:32-04:00

dhtmlxWindows API Methods * addUserButton adds a user button * allowMove allows a window to be moved * allowPark allows a window to be parked * allowResize allows a window to be resized * attachAccordion - attaches dhtmlxAccordion to a cell * attachChart - attaches dhtmlxChart to a cell * attachEditor - attaches dhtmlxEditor to a cell * attachFolders - attaches dhtmlxFolders to a cell * attachGrid - attaches dhtmlxGrid to a cell * attachLayout - attaches dhtmlxLayo…

dhtmlxslider:api_toc_alpha

Nadezhda — 2012-04-16T09:01:54-04:00

dhtmlxSlider API Methods dhtmlxSlider Object * attachEvent attaches an event handler to slider * detachEvent removes an event handler * disable disables dhtmlxSlider * enableTooltip enables/disables tooplips ( enabled by default ) * getValue gets value of slider control * init initialization of dhtmlxSlider object * linkTo links slider to other control * setImagePath sets path to images * setMax sets new TO value * setMin sets new FROM value * setOnChangeHandler sets on…

dhtmlxslider:api_method_dhtmlxslider_disable - created

Nadezhda — 2012-04-16T09:01:09-04:00

disable () Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxslider.js disables dhtmlxSlider slider.disable();

dhtmlxlayout:api_toc_alpha

Nadezhda — 2012-04-16T08:56:31-04:00

dhtmlXLayoutPanel Object (Cell) * attachAccordion - attaches dhtmlxAccordion to a cell * attachChart - attaches dhtmlxChart to a cell * attachDataView - attaches dhtmlxDataView to a cell * attachEditor - attaches dhtmlxEditor to a cell * attachGrid - attaches dhtmlxGrid to a cell * attachHTMLString - attaches html string to a cell * attachLayout - attaches dhtmlxLayout to a cell * attachMap - attaches Google Maps to a cell * attachMenu - attaches dhtmlxMenu to a cell …

dhtmlxlayout:api_method_dhtmlxlayoutobject_unload - created

Nadezhda — 2012-04-16T08:55:31-04:00

unload() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxlayout.js unloads an object and clears memory dhxLayout.unload();

dhtmlxwindows:api_method_dhtmlxwindows_unload

Nadezhda — 2012-04-16T08:51:27-04:00

unload() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxwindows.js unloads an object and clears memory dhxWins.unload();

dhtmlxlayout:event_ondblclick

Nadezhda — 2012-04-16T04:54:03-04:00

This event calls user-defined handlers (if there are any) and passes the following parameter: * itemId - the id of a clicked item layout.attachEvent("onDblClick", function (itemId){ //any custom logic here });

dhtmlxtreegrid:built-in_iterator

Nadezhda — 2012-04-12T09:58:11-04:00

Built-in Iterator This way of TreeGrid iteration has the following characteristic: * Used parameter - row ID; * Order of iteration is not equal to the current rows order in the grid (basically, it is equal to the adding order of rows to the grid, but it can be inconsistent); * In case of paging or smart rendering mode - all rows parsed at the current moment will be affected; * In case of applied filtering - all rows in the grid (including filtered out ones) will be included in ite…

dhtmlxgrid:api_method_dhtmlxgridobject_enableautowidth

Nadezhda — 2012-04-12T04:51:42-04:00

enableAutoWidth(mode, max_limit, min_limit) Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxgrid.js changes grid's container size on the fly to fit total width of grid columns * mode - truse/false - enable / disable * max_limit - max allowed width, not limited by default * min_limit - min allowed width, not limited by default

dhtmlxform:form_button

Nadezhda — 2012-04-11T10:41:14-04:00

Presents a standard button. Attributes * className - (string) the user-defined css class for an item * command - (string) a user-defined variable that is passed as the second parameter to the handler function of the onButtonClick() event (form.attachEvent(“onButtonClick”,function(name,command){...})) * inputLeft - (integer) sets the left absolute offset of input.Just position:“absolute” makes sense of the attribute * inputTop - (integer) sets the top absolute offset of input. Just p…

dhtmlxdataprocessor:api_method_dataprocessor_setupdated

Nadezhda — 2012-04-09T13:05:15-04:00

setUpdated(rowId,state,mode) Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxdataprocessor.js mark row as updated/normal. check mandatory fields,initiate autoupdate (if turned on) * rowId - id of row to set update-status for * state - true for “updated”, false for “not updated” * mode - update mode name - “inserted”,”updated”,”deleted” (“updated” by default)

dhtmlxform:dhxcombo

Nadezhda — 2012-04-06T09:59:28-04:00

dhtmlxCombo integration. Presents a normal combo box. Please note, to use combo item you must include several dhtmlxCombo related files: 1.If you use dhtmlxCombo standalone you need to include 3 files:

dhtmlxconnectorjava:toc_what_is_dhtmlxconnector

Nadezhda — 2012-04-06T05:56:24-04:00

dhtmlxConnector Usage Guide * Initialization of dhtmlxConnector * Data configuration * Formatting/Changing Data before Loading * Dynamical Loading * Sorting * Filtering * Complex Updates * Validating Data * Error Handling and Logging * Security

dhtmlxslider:api_method_dhtmlxslider_setskin

Nadezhda — 2012-04-05T10:34:27-04:00

setSkin(skin) Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxslider.js set the skin for the slider control * skin - (string) the skin name Possible values: * “ball” * “zipper” * “arrow” * “arrowgreen” * “simplesilver” * “simplegray” * “bar” * “dhx_skyblue”

dhtmlxform:newcolumn

Nadezhda — 2012-04-05T08:24:18-04:00

Allows to create a new column of items. Attributes * offset - (integer) sets the distance between columns Just write {type:"newcolumn"} and all further items will be placed into next column. In such way you can create any number of columns.

dhtmlxdatastore:methods

Nadezhda — 2012-04-04T12:45:42-04:00

* add - adds a new record to the dataset. * attachEvent - attaches handler for a custom event. * clearAll - clears a dataset. * copy - creates a copy of the item. * dataCount - returns size of a dataset. * detachEvent - detaches handler from a custom event. * exists - checks if an item with the defined id exists. * filter - filters a dataset. * first - gets ID of the first item. * idByIndex - returns an item's ID by the index. * indexById - returns an item's index by the ID.…

dhtmlxdatastore:api_method_dhtmlxdatastore_update - created

Nadezhda — 2012-04-04T12:45:22-04:00

Updates a specific item. var item1 = data.item(id); data.update(item1); Parameters: * item - the item object

dhtmlxdatastore:api_method_dhtmlxdatastore_item

Nadezhda — 2012-04-04T11:45:41-04:00

Returns hash of data related to the specific item. var item = data.item(id); alert(item.Version); item.Version = 2; //sets property 'Version' of the item to value '2'. Parameters: * id - the id of the item in question

start

Nadezhda — 2012-04-04T11:41:11-04:00

Components Layouts & data containers [Array] dhtmlxLayout [Array] dhtmlxAccordion [Array] dhtlmxTabbar [Array] dhtmlxWindows [Array] dhtmlxForm Data presentation [Array] dhtmlxGrid [Array] dhtmlxTree [Array] dhtmlxTreeGrid [Array] dhtmlxDataView [Array] dhtmlxChart

dhtmlxgrid:dhtmlxgrid_keymap_excel.js

Nadezhda — 2012-03-28T04:57:20-04:00

Excel Keymap Excel Keymap provides the following set of key for navigation in grid: * Enter + Ctrl - disables cell editor, there is no moving to any cell; * Enter+Shift - disables cell editor, selects cell located up relative to the current one; * Enter - disables cell editor, selects cell located down relative to the current one; * Tab - disables cell editor, selects the next right cell; * Tab+Shift - disables cell editor, selects the previous left cell; * F2 - enables cell ed…

dhtmlxform:dhxcalendar

Nadezhda — 2012-03-27T09:30:17-04:00

dhtmlxCalendar integration. Presents date field with pop-up calendar. Please note, to use calendar item you must include several dhtmlxCalendar related files: 1.If you use dhtmlxCalendar standalone you need to include 6 files:

dhtmlxcombo:api_method_dhtmlxcombo_setcombotext

Nadezhda — 2012-01-12T07:31:20-04:00

setComboText(text) Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxcombo.js set text in combobox * text - (string) new text label

dhtmlxcombo:api_toc_alpha

Nadezhda — 2012-01-12T07:31:08-04:00

dhtmlxCombo API Methods dhtmlXCombo Object * addOption adds new option * attachEvent attaches any user-defined event handler to available events * bind - binds components * clearAll clears all options from combobox * closeAll closes opened combobox list * confirmValue confirms the entered value (can be called on form submit) * deleteOption deletes option by value * destructor destroys object and any related HTML elements * detachEvent removes an event handler * disable d…

dhtmlxspreadsheet:pluginguide_wordpress

Maxim — 2012-01-11T10:37:32-04:00

To use functionality of the Spreadsheet plugin in WordPress you should perform the following actions: * Install the Spreadsheet plugin. * Activate it. * Insert the appropriate marker into a page or a post. Installing the plugin WordPress offers the following way of adding the plugin to your page:

dhtmlxaccordion:toc

Nadezhda — 2012-01-11T10:19:01-04:00

dhtmlxAccordion dhtmlxAccordion is a component that provides an easy and effective way of placing different types of content on a single page. It's a very flexible and easy-to-use content manager, compatible with other dhtmlx components that can be attached to dhtmlxAccordion without any difficulties (supports only vertical layout).

dhtmlxaccordion:googlemaps

Nadezhda — 2012-01-11T10:18:41-04:00

DhtmlxAccordion gives you the possibility to look over Google Maps in your application. You can add Google Map with both default and custom parameters. If initial params are not specified - the default ones will be used. To set an GoogleMaps object with default parameters - use the following codeline:

dhtmlxaccordion:objectattaching

Nadezhda — 2012-01-11T10:18:27-04:00

There is the possibility to add an object to any “objectless” accordion's item. To do this, you should firstly create this object on the page, and then, write one line of code to attach this object to an item of the accordion. For example, we will create a

element with the id “objId” and with some text inside it.

dhtmlxaccordion:urlattaching

Nadezhda — 2012-01-11T10:18:08-04:00

Sometimes it needs to display a web page in an Accordion's item. The attachURL() method is used for this purpose in the following way: dhxAccord.cells(itemId).attachURL(url); Accessing Inner Content Any object on the external page attached with the attachURL() method can be accessed like this:

dhtmlxaccordion:content_attaching - created

Nadezhda — 2012-01-11T10:17:47-04:00

You can attach to accordion the following items: * URL * Object * Google maps

dhtmlxlayout:api_toc_categories

Nadezhda — 2012-01-11T08:17:10-04:00

Initialization * dhtmlXLayoutObject - constructor * setSkin - sets layout's skin * setImagePath - sets path to images Effects * setEffect - sets effect * getEffect - returns true if the effect is enabled AutoSize * setAutoSize - sets autosize for the layout * listAutoSizes - returns array with available autosize settings * listViews - returns array with available layout patterns

dhtmlxlayout:api_method_dhtmlxlayoutobject_detachmenu

Nadezhda — 2012-01-11T08:08:26-04:00

detachMenu() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxlayout.js removes attached menu from a cell or the whole layout dhxLayout.detachMenu(); dhxLayout.cells(id).detachMenu();

dhtmlxlayout:api_method_dhtmlxlayoutobject_detachtoolbar

Nadezhda — 2012-01-11T08:07:49-04:00

detachToolbar() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxlayout.js removes attached toolbar from a cell or the whole layout dhxLayout.detachToolbar(); dhxLayout.cells(id).detachToolbar();

dhtmlxlayout:api_method_dhtmlxlayoutobject_detachstatusbar

Nadezhda — 2012-01-11T08:07:31-04:00

detachStatusBar() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxcontainer.js removes attached status bar from a cell or the whole layout. dhxLayout.detachStatusBar(); dhxLayout.cells(id).detachStatusBar();

dhtmlxlayout:api_method_dhtmlxlayoutobject_attachmenu

Nadezhda — 2012-01-11T08:02:23-04:00

attachMenu() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxlayout.js attaches dhtmlxMenu to the whole layout or a cell //to the whole layout var dhxMenu = dhxLayout.attachMenu(); // returns menu object // to a cell var dhxMenu = dhxLayout.cells(id).attachMenu(); // returns menu object

dhtmlxlayout:api_method_dhtmlxlayoutobject_attachtoolbar

Nadezhda — 2012-01-11T07:51:32-04:00

attachToolbar() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxlayout.js attaches a dhtmlxToolbar to the whole layout or a cell //to the whole layot var dhxToolbar = dhxLayout.attachToolbar(); // returns toolbar object //to a cell var dhxToolbar = dhxLayout.cells(id).attachToolbar(); // returns toolbar object

dhtmlxlayout:api_method_dhtmlxlayoutobject_showstatusbar

Nadezhda — 2012-01-11T07:49:06-04:00

showStatusBar() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxlayout.js shows status bar attached to a cell or the whole container dhxLayout.showStatusBar(); dhxLayout.cells(id).showStatusBar();

dhtmlxlayout:api_method_dhtmlxlayoutobject_attachstatusbar

Nadezhda — 2012-01-11T07:46:59-04:00

attachStatusBar() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxlayout.js attaches a status bar to the whole layout or a cell To the whole layout: var sb = dhxLayout.attachStatusBar(); // returns status bar object // setting status bar text sb.setText("Status Bar"); // getting status bar text var sbText = sb.getText();

dhtmlxdataprocessor:api_method_dataprocessor_defineaction

Nadezhda — 2012-01-11T04:54:15-04:00

defineAction (status, handlerFunc) Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxdataprocessor.js allows you to define handler function of the specified status dp.defineAction("update",function(response){ var message = response.getAttribute("message"); alert(message); return true;// return false to cancel default data processing at all })

dhtmlxlayout:dhtmlxlayout_sizingoptions

Nadezhda — 2012-01-10T08:48:14-04:00

DhtmlxLayout provides several sizing options. These are: * Common assignment * Fixed size * Autosize Common assignment There is a possibility to resize any item in Layout. However, there are some limitations in item sizing you should know:

dhtmlxwindows:api_toc_categories

Nadezhda — 2012-01-09T10:42:37-04:00

dhtmlXWindows Object Init/Unload * dhtmlXWindows constructor * unload unloads an object and clears memory Common * getId returns window's id * findByText returns array of window handlers found by header text * forEachWindow iterator - goes through all windows and calls a user handler * setSkin changes window's skin

dhtmlxtabbar:api_toc_alpha

Nadezhda — 2012-01-09T10:10:34-04:00

dhtmlxTabbar API Methods dhtmlXTabBar Object * addTab - adds tab to tabbar * attachEvent - attaches an event handler to tabbar * clearAll - reinitializes tabbar * detachEvent - removes an event handler * disableTab - disables tab in tabbar * enableAutoReSize - enables/disables auto adjusting height and width to outer conteiner * enableAutoSize - enables/disables auto adjusting height and width to inner content * enableContentZone - enables/disables content zone (enabled …

dhtmlxtabbar:api_toc_categories

Nadezhda — 2012-01-09T10:09:39-04:00

dhtmlxTabbar API Methods Configuration * enableAutoReSize - enable / disable auto adjusting height and width to outer conteiner * enableAutoSize - enable disable auto adjusting height and width to inner content * enableContentZone - enable/disable content zone (enabled by default) * enableForceHiding - enable/disable force hiding mode, solves IE problems with iframes in HTML content, but can cause problems for other dhtmlx components inside tabs * enableScroll - enable/disable…

dhtmlxlayout:api_method_dhtmlxlayoutpanel_attachgooglemaps

Nadezhda — 2012-01-09T10:05:04-04:00

attachMap() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxcontainer.js attaches Google Maps to the cell, returns GoogleMaps object Attaching to the layout's cell: var GMaps = dhxLayout.cells("b").attachMap(); // returns GoogleMaps object

dhtmlxaccordion:api_toc_alpha

Nadezhda — 2012-01-09T08:44:13-04:00

dhtmlXAccordionItem Object * attachAccordion - attaches dhtmlxAccordion to a cell * attachChart - attaches dhtmlxChart to a cell * attachEditor - attaches dhtmlxEditor to a cell * attachFolders - attaches dhtmlxFolders to a cell * attachGrid - attaches dhtmlxGrid to a cell * attachMap - attaches Google Maps to a cell * attachLayout - attaches dhtmlxLayout to a cell * attachMenu - attaches dhtmlxMenu to a cell * attachObject - attaches html object to a cell * attach…

dhtmlxaccordion:api_toc_categories

Nadezhda — 2012-01-09T08:43:22-04:00

dhtmlXAccordion Object Init * dhtmlXAccordionObject - constructor * unload - destructor Common * setIconsPath - sets the path to icons * setSizes - changes object instance's size according to the outer container * setEffect - sets an effect

dhtmlxaccordion:api_method_dhtmlxaccordionitem_attachchart - created

Nadezhda — 2012-01-09T08:42:35-04:00

attachChart() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxlayout.js / dhtmlxaccordion.js attaches dhtmlxChart to a cell, returns a chart object Attaching to a layout's cell: var chartConfig = { view:"bar", .... } var chart = dhxLayout.cells("a").attachChart(chartConfig); // returns a chart object chart.load(...);

dhtmlxlayout:api_method_dhtmlxlayoutpanel_attachchart - created

Nadezhda — 2012-01-09T07:48:11-04:00

attachChart() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxdataview.js attaches dhtmlxChart to a cell, returns chart object Attaching to a layout's cell: var chartConfig = { view:"bar", .... } var chart = dhxLayout.cells("a").attachChart(chartConfig); // returns chart object chart.load(...);

dhtmlxtoolbar:api_method_dhtmlxtoolbarobject_setrtl

Nadezhda — 2012-01-09T07:26:09-04:00

setRTL(state) Required library edition: [This method requires Professional Edition of the DHTMLX library] Required library file: dhtmlxSuite package enables rtl mode for toolbar * state - true/false toolbar.setRTL(state); // state = true/false

dhtmlxmessage:toc

Maxim — 2012-01-02T05:29:23-04:00

dhtmlxMessage is a helper that lets you create different text messages. Included files: * To use dhtmlxMessage you need to have dhtmlxcommon.js (or dhtmlx.js) included on the page. Attributes: * id - the instance's ID * text - the text of a message. * lifetime - the time after passing which a message disappears (in milliseconds). * type - css class for a message box. While creating css class, please, use 'important' keyword to ensure correct processing.

dhtmlxconnector:multi_sync

Nadezhda — 2011-12-19T11:09:29-04:00

APPLICABLE TO: Grid, TreeGrid, Tree, Combo, Scheduler, DataView, Chart, Form Starting from version 1.0, dhtmlxConnector can work in multi-user mode that allows users to see changes of each other in real time. To enable mode you need to write additions both to client- and server-sides:

dhtmlxtree:api_toc_alpha

Nadezhda — 2011-12-16T10:46:59-04:00

dhtmlxTree API Methods dhtmlXTreeObject Object * assignKeys - configures keys used for keyboard navigation * attachEvent - adds any user-defined handler to available events * bind - binds components * changeItemId - changes item id * clearCut - clears cut * clearSelection - unselects item in tree * closeAllItems - collapses target node and all sub nodes * closeItem - collapses node * deleteChildItems - deletes all children of node * deleteItem - deletes node * destruct…

dhtmlxconnectornet:select-box_columns_in_grid

Nadezhda — 2011-12-16T08:22:16-04:00

When grid has 'co'|'coro' columns ( select|combo-box ), it will automatically request data for them in the same manner as for filtering options. So, it's possible to use a similar way of logic to define which list of values needs to be used in select|combo inside the grid.

dhtmlxconnectornet:toc

Nadezhda — 2011-12-15T03:07:35-04:00

dhtmlxConnector .NET Connector is a set of .NET classes which help to simplify server-side operations related to DHTMLX components (dhtmlxGrid/TreeGrid, dhtmlxTree, dhtmlxCombo). The following operations are available in dhtmlxConnector: * dhtmlxgrid - data loading, server-side support for smart rendering and paging modes, CRUD operations, server-side configuration, filtering and sorting * dhtmlxtreegrid - data loading, server-side support for smart rendering and paging modes, CRUD ope…

dhtmlxgrid:api_method_dhtmlxgridobject_getrowsnum

Nadezhda — 2011-12-14T04:47:50-04:00

getRowsNum() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxgrid.js returns the number of rows in the grid (in case of dynamic mode it will return expected number of rows) var count=mygrid.getRowsNum();

dhtmlxspreadsheet:client_server_protocol

Nadezhda — 2011-12-08T08:09:11-04:00

This chapter will tell you about client-server communication in the context of 2 data operations: loading and update. Loading Initially, Spreadsheet loads a default 'skeleton' and doesn't store any information on the server except of the sheet id. After you change something and send a request, data related to this change is saved on the server. Next time you refresh the page or it is accessed by another user, Spreadsheet loads the 'skeleton' and gets data saved on the server to rewrite the a…

dhtmlxspreadsheet:start

Nadezhda — 2011-12-08T08:06:27-04:00

Spreadsheet is a classic spreadsheet allowing you quickly and easy to deal with data online: flexible presentation, export to PDF and Excel, export from Excel. Meanwhile, export to(from) Excel can be performed through standard Ctrl+C and Ctrl+V keyboard shortcuts.

dhtmlxspreadsheet:prog_guide_initialization

Nadezhda — 2011-12-08T08:05:57-04:00

* Initialization and read-only mode. * Client-server protocol. * Skins and Color Schemes.

dhtmlxspreadsheet:color_schemes - created

Nadezhda — 2011-12-08T08:05:03-04:00

Spreadsheet allows you to set different color variations. You can set 2 skins and specify various color schemes for them: * dhx_skyblue * autumn * clouds * rose * salad * sea * sky * yellowsand * dhx_web * blue * brown * deepblue * grass * oak * ocean * rose * summer * violet

dhtmlxspreadsheet:init - created

Nadezhda — 2011-12-08T08:02:05-04:00

Spreadsheet can be initialized in 2 ways: * Basic. * Advanced. And can be used in 2 modes (don't depend on the type of initialization): * Edit (by default). * Read-only. PLEASE NOTE, BEFORE INITIALIZATION YOU MUST PERFORM SPREADSHEET INSTALLATION.

dhtmlxdatastore:step-by-step_example

Nadezhda — 2011-12-01T07:41:04-04:00

You probably find it hard to think of situations where this “invisible store” would be useful. So, let's consider as example some company. It has some number of departments. Each department contains its employees. The goal Let's assume we want to present on a page the following:

binding

Nadezhda — 2011-12-01T05:34:04-04:00

Overview When you deal with multiple related components on client-side, you can define rules how their data will be linked. So changed value in some component will be reflected in other components. There are 2 main ways to link data: * when data in master component is changed - slave component gets new data; * when selection in master component is changed - slave component gets new data.

dhtmlxscheduler:minicalendar

Nadezhda — 2011-11-29T09:51:39-04:00

Mini calendar Basics Mini calendar provides ability to render a small month view in any html container on a page. It has an optional “on-date-selected” handler and can be used to simplify date selection or for some other tasks. For all next use-cases you need to include on the page the following files:

dhtmlxconnector:server_side_others

Nadezhda — 2011-11-29T07:48:31-04:00

DB types MySQL ( php_mysql ) require("connector/grid_connector.php"); $res=mysql_connect("localhost","root",""); mysql_select_db("myDatabase"); $gridConn = new GridConnector($res,"MySQL"); MySQLi ( php_mysqli ) require("connector/grid_connector.php"); require("connector/db_mysqli.php"); $mysqli = new mysqli($server, $user, $pass, $mysql_db); $gridConn = new GridConnector($mysqli,"MySQLi");

dhtmlxscheduler:localization

Nadezhda — 2011-11-29T04:18:41-04:00

Localization Included locales scheduler include localization for next languages Language Common locale Recurring events form Arabic sources/locale_ar.js not translated English default default Catalan sources/locale_cn.js not translated Chinese sources/locale_cn.js sources/locale_recurring_cn.js Czech sources/locale_cs.js sources/locale_recurring_cs.js Danish sources/locale_da.js sources/locale_recurring_da.js Dutch sources/locale_nl.js not translated Finni…

dhtmlxform:html

Nadezhda — 2011-11-28T09:15:54-04:00

We can single out HTML initialization from other available ways. The reason - it's some kind of automatic initialization. After the page has been completely parsed - the form instance 'looks for' HTML data for initialization. If it finds the appropriate data - it's used for initialization.

dhtmlxform:json

Nadezhda — 2011-11-28T09:15:06-04:00

Initial Data As initial data we'll take the following form: Configuration In JSON the data will look as: [ {type: "fieldset", name: "data", label: "Welcome", inputWidth: "auto", list:[ {type:"input", name: "name", label:"Login"}, {type:"password", name:"pass", label:"Password"}, {type:"button", name:"save", value:"Proceed"}] } ]

dhtmlxform:api_method_dhtmlxform_loadstruct

Nadezhda — 2011-11-28T09:14:36-04:00

loadStruct(data,onLoadFunction) Loads XML into dhtmlxForm instance. Parameters: * data - the http path to an XML file * onLoadFunction - (optional) a user defined handler which is called when loading has been done myForm.loadStruct("file.xml", function(){ // onload handler });

dhtmlxgrid:api_method_dhtmlxgridobject_save

Nadezhda — 2011-11-28T06:54:03-04:00

save(row_id) Lets you to save row data in DB programmatically. The method start to be available when the grid is bound to dataStore. Parameters: * row_id - (string) the id of a row var store = new dhtmlXDataStore(); grid.sync(store); var selectedItem = myGrid.getSelectedRowId(); grid.save(selectedItem);

dhtmlxgrid:api_toc_alpha

Nadezhda — 2011-11-28T06:51:37-04:00

dhtmlxGrid API Methods dhtmlXGridObject Object * addRow - adds row to the grid * addRowFromClipboard - adds a new row from the clipboard * adjustColumnSize - autosizes a column to max content size * attachEvent - adds any user-defined handler to available events * attachFooter - attaches an additional line to the footer * attachHeader - attaches an additional line to the header * attachToObject - attaches grid to some object in DOM * bind - binds components * cellB…

dhtmlxgrid:api_toc_categories

Nadezhda — 2011-11-28T06:50:54-04:00

dhtmlxGrid API Methods Configuration * attachEvent adds any user-defined handler to available events * attachFooter attaches an additional line to the footer * attachHeader attaches an additional line to the header * attachToObject attaches grid to some object in DOM * destructor destructor, removes grid and cleans used memory * detachEvent removes an event-handler * detachFooter removes the footer line from grid (opposite to attachFooter) * detachHeader removes the header l…

dhtmlxdatastore:crud_operations_in_bound_components

Nadezhda — 2011-11-28T05:44:14-04:00

To perform any data manipulation in the bound-to-DataStore component(s), you should remember the main thing - operations are performed under components indirectly, by means of the related dhtmlxDataStore object. What does it mean? If you want, for example, delete some record from a grid, you should delete it from DataStore the grid is bound to. After the record is deleted from Datastore, it automatically will be deleted from the grid. And it concerns any operation: update, deletion, creation, f…

dhtmlxdatastore:toc

Nadezhda — 2011-11-28T05:05:34-04:00

The article tells you about dhtmlXDataStore, the component which is basically designed to perform a function of data store. But at the same time, it's a full-fledged dhtmlx component with its own API. classic use-case * Storing data that's used by several components on a page. You can use more than one DataStore. They can be linked or not.

dhtmlxscheduler:timeline

Nadezhda — 2011-11-18T08:00:30-04:00

In timeline view, vertical scale presents event holders, while vertical scale is a configurable time-scale. The view has 3 modes: * Bar mode * Cell mode * Tree mode To init this view, regardless of mode type, you need to make the following steps firstly:

dhtmlxtree:api_toc_categories

Nadezhda — 2011-11-16T10:53:43-04:00

Appearance * enableHighlighting - enables item highlighting (item text highlited on mouseover) * enableIEImageFix - replaces IMG tag with background images - solve problem with IE image caching , not works for IE6 SP1 * enableLoadingItem - enables/disables “Loading...” item * enableMultiLineItems - enables multi line items * enableTextSigns - replaces images with text signs * enableTreeImages - enables tree images * enableTreeLines - enables/disables tree lines (parent-child threa…

dhtmlxgrid:creating_editable_excells

Nadezhda — 2011-11-15T10:54:58-04:00

Creating Editable Excells The editable excells use the same approach, but with a few additional methods. Lets analyze the simplest case: function eXcell_button(cell){ //excell name is defined here if (cell){ //default pattern, just copy it this.cell = cell; this.grid = this.cell.parentNode.grid; eXcell_ed.call(this); //use methods of "ed" excel…

dhtmlxtree:api_method_dhtmlxtreeobject_sorttree

Nadezhda — 2011-11-15T10:52:54-04:00

sortTree(nodeId,order,all_levels) Required library edition: [This method requires Professional Edition of the DHTMLX library] Required library file: dhtmlxtree_sb.js reorder items in tree according to their text * nodeId - id of node to start sorting from * order - sorting order - ASC or DES * all_levels - sorting all levels or only current level

dhtmlxgrid:api_method_dhtmlxgridobject_setpagingwtmode

Nadezhda — 2011-11-15T09:58:48-04:00

setPagingWTMode(navButtons,navLabel,pageSelect,perPageSelect) Required library edition: [This method requires Professional Edition of the DHTMLX library] Required library file: dhtmlxgrid_pgn.js configure paging with toolbar mode ( must be called BEFORE enablePaging)

dhtmlxgrid:grouping

Nadezhda — 2011-11-11T07:55:27-04:00

Grouping To activate grouping functionality, the user should include dhtmlxgrid_group.js into the page. Grouping by Value The user can group data by some column in the Grid on the fly. This technique doesn't require any specific XML formatting and can be done by grid dynamically without any preparations. Grouping parameters can be changed any time. Also, grid records can be ungrouped. It is also possible to expand/collapse groups programmatically. After changing data in the column the grid w…

dhtmlxscheduler:templates

Support — 2011-11-11T04:52:34-04:00

The mobile scheduler lets you define 10 templates. They can be used to change dispaying dates and titles in the scheduler. Beware, templates' definitions should go before the code line with scheduler initialization. Below you can find a list of all available in the mobile version templates and their default definitions.

migrating_to_version_3.0

Nadezhda — 2011-11-08T10:26:51-04:00

Version 3.0 is backward compatible by API with the older versions and generally, you don't need to make any special corrections in the code to update the codebase to version 3.0 . Starting from version 2.5 dhtmlxLayout, dhtmlxAccordion and dhtmlxTabbar don't require to have dhtmlxWindows js files included. But don't forget to add dhtmlxcontainer.js on the page for these components.

dhtmlxmenu:api_method_dhtmlxmenuobject_setimagepath

Nadezhda — 2011-11-04T08:43:08-04:00

setImagePath() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxmenu.js depricated, not more used from version 2.1, 90226

dhxwsc:apiref

Nadezhda — 2011-11-04T08:39:09-04:00

API Reference There is AJAX WebService Component reference, that describes all public methods and properties for our component, including * meta-information management (WSDLInfo and related classes) * Low-level WebService invocation (WSClient) * High-level API ()

dhtmlxgrid:migration

Nadezhda — 2011-11-04T08:35:18-04:00

Changes between Versions * dhtmlxGrid 1.x -> 1.6 * dhtmlxGrid 2.1 -> 2.5

tutorials:dhtmlx_today:components

Nadezhda — 2011-11-04T08:04:05-04:00

DHTMLX library v.3.0 offers 18 components included in dhtmlxSuite (all of them has the same version number as 'Suite' has), plus dhtmlxVault, dhtmlxScheduler and dhtmlxGantt. dhtmlxLayout is the base for interfaces. Although you can use components without it (placing them directly on the page), it will be a good idea to use dhtmlxLayout for predefining the structure of your application interface. First of all, it provides basic functionality, common for any user friendly applications, - resiz…

dhtmlxlayout:dhtmlxlayout_views

Nadezhda — 2011-11-04T07:22:19-04:00

View is a novelty of 2.6 version. It makes possible to show different contents for the same cell. Developers don't tie to the one content and can change it depending on their needs. For example, you have a car list in one cell. And in the other one you want represent offer's adding form, grid with availible offers and car image subject to a user's actions. Now it's possible. For each of scenario you can show an individual content.

dhtmlxlayout:toc

Nadezhda — 2011-11-04T07:21:24-04:00

dhtmlxLayout DhtmlxLayout is a pure JavaScript product that lets you compose several items into a single desktop layout, place different types of content on one page. It's flexible and easy-to-use tool. INTRODUCTION * dhtmlxLayout Overview

dhtmlxtree:initialization_of_dhtmlxtree

Nadezhda — 2011-11-01T08:26:48-04:00

Initialization of dhtmlxTree dhtmlxTree can be initialized on page using one of the following initialization schemes: * Object-based initialization; * Initialization from HTML. Complete the following steps for any type of dhtmlxTree's initialization:

dhtmlxgrid:event_onsubgridcreated_onsubgridloaded

Nadezhda — 2011-11-01T05:38:32-04:00

onSubGridCreated/onSubGridLoaded Events Required library edition: [This method requires Professional Edition of the DHTMLX library] onSubGridCreated event occurs when the creation of a sub-grid was initiated; onSubGridLoaded event occurs after data from the sub-grid is loaded and parsed.

dhtmlxtoolbar:xml_format_template

Nadezhda — 2011-10-28T08:57:50-04:00

XML Format Template This section is created in order to give the user the idea of XML Format Template. It aims at helping users in creating XML files for dhtmlxToolbar initialization. // a top xml tag, mandatory // a button item with images for enabled/disabled state only; // each item must have a unique ID // a button item with…

dhtmlxtoolbar:adding_and_removing_items

Nadezhda — 2011-10-28T08:34:00-04:00

Adding and Removing Items Button Adding A Button item can be easily added to the toolbar with the help of the following method: Parameters that should be passed are:

dhtmlxtoolbar:api_method_dhtmlxtoolbarobject_addbuttonselect

Nadezhda — 2011-10-28T08:27:57-04:00

addButtonSelect(id, pos, text, opts, imgEnabled, imgDisabled, renderSelect, openAll, maxOpen) Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxtoolbar.js adds a select button to webbar

dhtmlxspreadsheet:userguide_formulas

Nadezhda — 2011-10-28T06:47:23-04:00

A formula is a mathematical equation used to calculate a value. It can be entered directly in a cell or through the Formula Bar. A formula can contain both mathematical expressions created by yourself and mathematical expressions already available in Spreadsheet ( hereafter referred to as functions).

dhtmlxspreadsheet:pluginguide_joomla

Nadezhda — 2011-10-28T04:50:15-04:00

To use functionality of the Spreadsheet plugin in Joomla you should perform the following actions: * Install the Spreadsheet plugin. * Activate it. * Insert the appropriate marker into an article. The most recent version of Joomla can be downloaded here.

dhtmlxspreadsheet:pluginguide_modx

Nadezhda — 2011-10-28T04:49:12-04:00

To use functionality of the Spreadsheet plugin in MODx you should perform the following actions: * Install the Spreadsheet plugin. * Insert the appropriate marker into an article. The most recent version of MODx can be downloaded here. Installing the plugin MODx offers the following way of adding the plugin to your article:

dhtmlxspreadsheet:pluginguide_drupal

Nadezhda — 2011-10-28T04:45:54-04:00

To use functionality of the Spreadsheet plugin for Drupal you should perform the following actions: * Install the Spreadsheet plugin. * Activate it. * Insert the appropriate marker into a page or a post. The most recent version of Drupal can be downloaded here.

dhtmlxspreadsheet:user_guide

Nadezhda — 2011-10-27T13:19:21-04:00

* Basic * Fundamental definitions * Navigation within Spreadsheet * Worksheet settings * Main toolbar * Data in a cell * Selecting a cell and entering text * Formatting: font style, color, background and alignment * Copying and moving data between cells * Formulas

dhtmlxchart:dhxfilter

Nadezhda — 2011-10-27T09:22:21-04:00

Charts provides ability to filter data by one or several criteria. In this case, only items those match the parameters will be shown. To filter dataset you need to call filter() method. Each time the method is called, all chart data are refiltered (previous results aren't preserved).

dhtmlxscheduler:known_issues

Nadezhda — 2011-10-27T08:40:23-04:00

Known issues * Problem: in case of Brazil timezone, during summer time shift, scheduler can render double days ( so far, there was only few reports from users of Brazil-version of Windows, problem doesn't appear for any other type of OS ) Symptom: double days in month view Affected versions: all versions Patch: Patch need to be included on the page after other js files. * Problem: time limit set using blockTime…

dhtmlxlayout:api_method_dhtmlxlayoutpanel_attachscheduler - created

Nadezhda — 2011-10-20T12:59:08-04:00

attachScheduler(date, mode) Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxlayout.js attaches dhtmlxScheduler to a cell * date - a js date object, the initial date in the scheduler, optional - the current date will be used by default * mode - the name of the default mode as string ( 'month','day','week' ), optional - 'week' by default

dhtmlxlayout:dhtmlxattaching

Nadezhda — 2011-10-20T12:55:15-04:00

The following components can be attached to dhtmlxLayout's items: * dhtmlxAccordion; * dhtmlxEditor; * dhtmlxFolders; * dhtmlxGrid; * dhtmlxMenu; * dhtmlxScheduler; * dhtmlxTabbar; * dhtmlxToolbar; * dhtmlxTree; * dhtmlxTreeGrid; * Status Bar.

dhtmlxlayout:progress_control

Nadezhda — 2011-10-20T09:53:32-04:00

Progress control is a state indicator. It can be used to indicate content loading or updating. It can be applied to whole layout or just to a cell. The cell or whole layout is visually disabled and not accessible for user actions while progress is enabled.

tutorials:toc

Nadezhda — 2011-10-19T12:00:48-04:00

* Quick start with DHTMLX * Start building web applications today * dhtmlxLayout. From layout to interface * dhtmlxGrid. Basics * dhtmlxGrid. Easy dealing with server-side * dhtmlxForm. Easy dealing with server-side * dhtmlx 2.0. Step by step * dhtmlxScheduler and Google Calendar * dhtmlxScheduler for ASP.NET MVC * Editable datagrid for Ruby on Rails built with dhtmlxGrid * How to build online store with dhtmlxDataView * How to use dhtmlxGri…

dhtmlxtree:error_handling

Nadezhda — 2011-10-19T05:22:17-04:00

Error Handling Some exceptions in dhtmlxTree can be captured and processed. function myErrorHandler(type, desc, erData){ alert(erData[0].status) } dhtmlxError.catchError("ALL",myErrorHandler); The handler gets the following parameters:

dhtmlxconnectorjava:toc

Maxim — 2011-10-18T06:12:02-04:00

dhtmlxConnector dhtmlxConnector is a set of Java classes which helps to simplify server side operations related to dhtmlx library components (dhtmlxGrid/TreeGrid, dhtmlxTree, dhtmlxCombo, dhtmlxScheduler). The following operations are available in dhtmlxConnector :

dhtmlxeditor:toc

Nadezhda — 2011-10-18T04:52:28-04:00

dhtmlxEditor This component is a simple text editor that can be used in web pages. It contains functionality that is often used in desktop editors. So if you've ever used MS Word or Open Office, you wouldn't have any trouble using dhtmlxEditor for writing texts and formatting them in the Web.

dhtmlxeditor:api_toc_alpha

Nadezhda — 2011-10-18T04:52:08-04:00

dhtmlxEditor API Methods dhtmlXEditor Object * alignCenter - centres seleted text * alignJustify - makes text to take the entire space available * alignLeft - aligns selected text along the left margin * alignRight - aligns selected text along the right margin * applyBold - makes selected text bold * applyH1 - applies H1 to selected block of text * applyH2 - applies H2 to selected block of text * applyH3 - applies H3 to selected block of text * applyH4 - applies H4 to sele…

dhtmlxgrid:api_method_dhtmlxgridobject_unmarkall

Nadezhda — 2011-10-13T10:30:29-04:00

unmarkAll() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxgrid_markers.js removes selection from all marked cell mygrid.unmarkAll(); See also: enableMarkedCells, getMarked, mark

dhtmlxgrid:api_method_dhtmlxgridobject_getmarked

Nadezhda — 2011-10-13T10:27:55-04:00

getMarked() Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxgrid_markers.js Returns the array of marked cells (pairs of row id and column index) var markedArray = mygrid.getMarked();

dhtmlxgrid:api_method_dhtmlxgridobject_mark

Nadezhda — 2011-10-13T10:27:42-04:00

mark(rid,cindex,fl) Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxgrid_markers.js sets selection or removes selection from specified cell * r - row object or row index * cInd - cell index * state - true or false

dhtmlxgrid:api_method_dhtmlxgridobject_enablemarkedcells

Nadezhda — 2011-10-13T10:27:29-04:00

enableMarkedCells(mode) Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxgrid_markers.js Sets marked cells support to enabled or disabled state. The user will be able to select single cell instead of selection whole row. Note this functionality is mutually exclusive with standard selection functionality.

dhtmlxconnectorjava:complex_updates

Maxim — 2011-10-13T06:10:18-04:00

Complex updates By default connector generates all create|update|delete queries automatically, based on configuration. But in some cases it may be necessary to define your own logic. It can be done in one of two ways * defining custom SQL code for operation * using server side events to customize operations

dhtmlxgrid:toc_integration_with_extjs

Nadezhda — 2011-10-10T11:41:48-04:00

Integration with ExtJS Download library The main approach to replace ExtJS grid with dhtmlxgrid is: * Using dhtmlxgrid in Parallel with the Ext.Grid Using Native API of dhtmlxgrid Including dhtmlxgrid in ExtJs Layout

visualdesigner:designer_from_designer_to_app

Nadezhda — 2011-10-10T04:42:26-04:00

You have created the desired design. What do you do now? How can you use it in a real app? Here is a small guide describing you further steps. HTML Page Setup 1. Download DHTMLX code files To use the created design in an app, you should include code files of the related DHTMLX components to your HTML page. If you have dealed with many components it would be a long list. So, we reccomend to use 'dhtmlxSuite' package (you can download it here) as alternative to standalone components. In case o…

dhtmlxtree:syntax_templates

Nadezhda — 2011-10-07T07:21:48-04:00

Syntax Templates XML Format Template XML syntax template is the following: true

dhtmlxtreegrid:api_method_dhtmlxgridobject_getsubitems

Nadezhda — 2011-10-04T04:42:59-04:00

getSubItems(rowId) Required library edition: [This method requires Professional Edition of the DHTMLX library] Required library file: dhtmlxtreegrid.js returns a list of child row ids, separated by comma * rowId - the id of a row Returns a list of child rows

dhtmlxform:events_handling

Nadezhda — 2011-10-03T08:31:38-04:00

dhtmlxForm allows to handle different events using its events handling system. In general it is similar to what is used in other DHTMLX components. You can attach several handlers to the same event and detach them using two respective methods: attachEvent(...) and detachEvent(...)

dhtmlxgrid:api_method_dhtmlxgridobject_enableheadermenu

Nadezhda — 2011-09-29T09:56:15-04:00

enableHeaderMenu() Required library edition: [This method requires Professional Edition of the DHTMLX library] Required library file: dhtmlxgrid_hmenu.js enable pop up menu which allows hidding/showing columns * a string with comma delimited true/false values. true value says that the related column will be shown.

dhtmlxscheduler:mobile_advanced

Nadezhda — 2011-09-26T09:59:28-04:00

The mobile scheduler has a multiview-based architecture supplemented with the bottom toolbar. Details see in the related DHTMLX Touch documentation 'Building app architecture'. Please remember, you can customize just toolbars of the scheduler. It can be either the main bottom toolbar or toolbars of views of the multiview.

dhtmlxtabbar:attaching_components_to_the_tabbar

Support — 2011-09-23T05:01:31-04:00

Attaching DHTMLX Components Attaching Components to Tabbar's cells The following components can be attached to dhtmlxTabbar items: * dhtmlxTree; * dhtmlxGrid; * dhtmlxTreeGrid; * dhtmlxTabbar; * dhtmlxAccordion; * dhtmlxFolders; * dhtmlxMenu; * dhtmlxToolbar; * dhtmlxEditor; * dhtmlxLayout; * Status Bar.

dhtmlxgrid:smart_rendering

Nadezhda — 2011-09-19T05:47:38-04:00

Smart Rendering in Grid dhtmlxgrid_srnd.js required Smart Rendering mode increases overall grid performance working with big amounts of data by saving time on render operation that is most time consuming in dhtml. When this mode is activated, only those rows are rendered that are in the visible area. The user can apply it with already loaded content or activate dynamical loading to fetch rows from the server each time (or activate buffering additionally to decrease the number of server reques…

others:how_to_create_the_completed_demo

Nadezhda — 2011-09-14T10:42:08-04:00

This article covers the process of creating the completed demo which speeds up your problem solving. 4 main things you must be guided by: * included css/js files * code that causes the problem * used xml & image files * and the most important one - the app must be executed finally

dhtmlxscheduler:units_view

Nadezhda — 2011-09-14T06:57:53-04:00

Units view Starting from dhtmlxScheduler 2.0 it possible to create a view, where x-scale is based on some property of events (not only on time). At first, an additional js file needs including.

dhtmlxscheduler:api_method_dhtmlxscheduler_createunitsview

Nadezhda — 2011-09-14T06:50:14-04:00

createUnitsView(configuration) Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxscheduler_units.js creates a units view Method accepts the only parameter - configuration object var sections=[ {key:1, label:"Section A"}, {key:2, label:"Section B"}, {key:3, label:"Section C"}, {key:4, label:"Section D"} ]; scheduler.createUnitsView({ name:"unit", property:"section_id", list: [ {key:1, label:"Section A"}, {key:2, labe…

dhtmlxform:xml

Nadezhda — 2011-09-12T12:52:48-04:00

Before considering XML details we'd like to mention that among possible ways of initialization we recommend to use JSON as the handiest way. Initial Data As initial data we'll take the following form: Configuration In XML the data will look as:

dhtmlxcalendar:dhtmlxcalendar_event_onbeforechange

Nadezhda — 2011-09-12T11:27:10-04:00

Fires before a user starts to change month, year or time in selector. myCalendar.attachEvent("onBeforeChange",function(date){ alert("Date will be set to "+date) }) Parameters of handler function: * date - the selected date. Description:

dhtmlxgrid:formatting_date_values

Nadezhda — 2011-09-12T09:19:43-04:00

Formatting Date Values Date formatting can be applied to dhxCalendar and dhxCalendarA columns. Date formatting applied to the whole grid (so it will be used in any column of dhxCalendar type) can be set as: grid.setDateFormat(mask) Or in case of initialization from XML:

dhtmlxscheduler:custom_details_form

Nadezhda — 2011-09-12T06:42:25-04:00

Custom "details" form Structure of details form Header of details form - text defined by next templates scheduler.templates.event_header scheduler.templates.event_bar_text Sections below are defined through scheduler.config.lightbox.sections (see details here), default configuration is the next:

dhtmlxgrid:api_method_dhtmlxgridobject_getcolindexbyid

Nadezhda — 2011-09-09T06:44:03-04:00

getColIndexById(id) Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxgrid.js gets column index by column id * id - column id //get index of the column with id "col1" var colIndex=mygrid.getColIndexById("col1");

dhtmlxgrid:api_method_dhtmlxgridobject_setcolumnids

Nadezhda — 2011-09-09T06:40:35-04:00

setColumnIds(ids) Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxgrid.js sets id to every column. Can be used then to retreive the index of the desired colum * ids - comma delimitered list of ids or empty if to use values set earlier

dhtmlxgrid:api_method_dhtmlxgridobject_setcolumnid

Nadezhda — 2011-09-09T06:38:52-04:00

setColumnId(ind, id) Required library edition: [This method works with any edition of DHTMLX library] Required library file: dhtmlxgrid.js sets id to specified column. * ind- index of column * id- id of column //set first column id mygrid.setColumnId(0,"column1");

dhtmlxscheduler:mobile_data

Nadezhda — 2011-09-08T12:32:03-04:00

Loading data To load events to the scheduler you should use either the method load() or the method parse(): $$("scheduler_id").load("data/events.xml","xml"); //or $$("scheduler_id").parse([ { id:1, start_date:"2009-7-1 6:00", end_date:"2009-7-1 8:00", text:"Event 1"}, { id:2, start_date:"2009-7-2 6:00", end_date:"2009-7-2 8:00", text:"Event 2"} ],"json");

dhtmlxscheduler:mobile_styling

Nadezhda — 2011-08-29T12:07:59-04:00

To customize some element of the scheduler you should redefine the needed attributes of the related css class in