Techniques and Web Technologies
To ensure that REDIPS.drag library will work with any other JavaScript framework, it was necessary to rename all class names. The main issue was conflict with latest version of Bootstrap and “mark” class name. This post contains list of old and new class names used by REDIPS.drag.
Post shows modification of REDIPS.drag.saveContent() method. I got a lot of questions regarding how to save values from input fields (embedded in DIV element). Source below will search for input text fields and append values to query string and JSON object.
REDIPS.drag version 5 has major name changes in properties, methods and event handlers. Here you will find listed old and new names so migration to version 5 should not be a problem. Main intention for this change was to have consistent names of properties, methods and event handlers.
REDIPS.table is a JavaScript library which enables dynamically merging and splitting table cells. Here you will see a list of public properties and methods contained in REDIPS.table library. Documentation is generated with JsDoc Toolkit.
REDIPS.table is small JavaScript library which enables interactive or through script merging and splitting table cells. REDIPS.table.onMouseDown() public method will activate onMouseDown event listeners on TD elements to enable mark cells with mouse button. Additional feature is appending / deleting table rows / cells.
Here is list of keywords (mostly class names) used in REDIPS.drag library. Id of drag container(s) or table cell class names should be named properly to achieve needed functionality like cloning DIV elements, adding trash cell, mark cells, adding row handler or mark table as “nolayout”. This post is appendix to the REDIPS.drag documentation post.
Demo shows how to toggle or clear checkbox group. On button click, all checkboxes in HTML table will change checked state. Checkbox group can be defined with any container so it’s not necessary to use a table. This is really simple JavaScript function with checkbox toggle and clear options.
Demo is based on REDIPS.drag JavaScript library with enabled shift drop option. After element is dropped to the cell, other elements will be shifted to make room. Animation is optional and can be turned off. The presented demo can be a good start point for various sorting Web applications.
Why IE8 displays error for console.log line in JavaScript? Well, developer tools should be activated if you intend to use console.log command. Just press F12 (to turn on developer tools) and F5 (to reload the same page) – and error will disappear magically.
Every HTML element in DOM has reference to its parent node. With simple iteration it’s possible to traverse up to requested element. If this loop is wrapped within a function, you will get a very useful code.
Example shows drag-n-drop functionality in combination with animation. Tables are closed within separated drag containers and actions from any table are mirrored to the other table. Elements can be shuffled or reset to the initial position.
REDIPS.drag is a JavaScript drag and drop library focused on dragging table content and table rows. Here you will see a list of public properties and methods contained in REDIPS.drag library. Documentation is generated with JsDoc Toolkit.