diff options
Diffstat (limited to 'dev/jquery.jtable.masterchild.js')
| -rw-r--r-- | dev/jquery.jtable.masterchild.js | 166 |
1 files changed, 166 insertions, 0 deletions
diff --git a/dev/jquery.jtable.masterchild.js b/dev/jquery.jtable.masterchild.js new file mode 100644 index 0000000..9b769a0 --- /dev/null +++ b/dev/jquery.jtable.masterchild.js @@ -0,0 +1,166 @@ +/************************************************************************
+* MASTER/CHILD tables extension for jTable *
+*************************************************************************/
+(function ($) {
+
+ //Reference to base object members
+ var base = {
+ _removeRowsFromTable: $.hik.jtable.prototype._removeRowsFromTable
+ };
+
+ //extension members
+ $.extend(true, $.hik.jtable.prototype, {
+
+ /************************************************************************
+ * DEFAULT OPTIONS / EVENTS *
+ *************************************************************************/
+ options: {
+ openChildAsAccordion: false
+ },
+
+ /************************************************************************
+ * PUBLIC METHODS *
+ *************************************************************************/
+
+ /* Creates and opens a new child table for given row.
+ *************************************************************************/
+ openChildTable: function ($row, tableOptions, opened) {
+ var self = this;
+
+ //Show close button as default
+ tableOptions.showCloseButton = (tableOptions.showCloseButton != false);
+
+ //Close child table when close button is clicked (default behavior)
+ if (tableOptions.showCloseButton && !tableOptions.closeRequested) {
+ tableOptions.closeRequested = function () {
+ self.closeChildTable($row);
+ };
+ }
+
+ //If accordion style, close open child table (if it does exists)
+ if (self.options.openChildAsAccordion) {
+ $row.siblings('.jtable-data-row').each(function () {
+ self.closeChildTable($(this));
+ });
+ }
+
+ //Close child table for this row and open new one for child table
+ self.closeChildTable($row, function () {
+ var $childRowColumn = self.getChildRow($row).children('td').empty();
+ var $childTableContainer = $('<div />')
+ .addClass('jtable-child-table-container')
+ .appendTo($childRowColumn);
+ $childRowColumn.data('childTable', $childTableContainer);
+ $childTableContainer.jtable(tableOptions);
+ self.openChildRow($row);
+ $childTableContainer.hide().slideDown('fast', function () {
+ if (opened) {
+ opened({
+ childTable: $childTableContainer
+ });
+ }
+ });
+ });
+ },
+
+ /* Closes child table for given row.
+ *************************************************************************/
+ closeChildTable: function ($row, closed) {
+ var self = this;
+
+ var $childRowColumn = this.getChildRow($row).children('td');
+ var $childTable = $childRowColumn.data('childTable');
+ if (!$childTable) {
+ if (closed) {
+ closed();
+ }
+
+ return;
+ }
+
+ $childRowColumn.data('childTable', null);
+ $childTable.slideUp('fast', function () {
+ $childTable.jtable('destroy');
+ $childTable.remove();
+ self.closeChildRow($row);
+ if (closed) {
+ closed();
+ }
+ });
+ },
+
+ /* Returns a boolean value indicates that if a child row is open for given row.
+ *************************************************************************/
+ isChildRowOpen: function ($row) {
+ return (this.getChildRow($row).is(':visible'));
+ },
+
+ /* Gets child row for given row, opens it if it's closed (Creates if needed).
+ *************************************************************************/
+ getChildRow: function ($row) {
+ return $row.data('childRow') || this._createChildRow($row);
+ },
+
+ /* Creates and opens child row for given row.
+ *************************************************************************/
+ openChildRow: function ($row) {
+ var $childRow = this.getChildRow($row);
+ if (!$childRow.is(':visible')) {
+ $childRow.show();
+ }
+
+ return $childRow;
+ },
+
+ /* Closes child row if it's open.
+ *************************************************************************/
+ closeChildRow: function ($row) {
+ var $childRow = this.getChildRow($row);
+ if ($childRow.is(':visible')) {
+ $childRow.hide();
+ }
+ },
+
+ /************************************************************************
+ * OVERRIDED METHODS *
+ *************************************************************************/
+
+ /* Overrides _removeRowsFromTable method to remove child rows of deleted rows.
+ *************************************************************************/
+ _removeRowsFromTable: function ($rows, reason) {
+ var self = this;
+
+ if (reason == 'deleted') {
+ $rows.each(function () {
+ var $row = $(this);
+ var $childRow = $row.data('childRow');
+ if ($childRow) {
+ self.closeChildTable($row);
+ $childRow.remove();
+ }
+ });
+ }
+
+ base._removeRowsFromTable.apply(this, arguments);
+ },
+
+ /************************************************************************
+ * PRIVATE METHODS *
+ *************************************************************************/
+
+ /* Creates a child row for a row, hides and returns it.
+ *************************************************************************/
+ _createChildRow: function ($row) {
+ var totalColumnCount = this._$table.find('thead th').length;
+ var $childRow = $('<tr></tr>')
+ .addClass('jtable-child-row')
+ .append('<td colspan="' + totalColumnCount + '"></td>');
+ $row.after($childRow);
+ $row.data('childRow', $childRow);
+ $childRow.hide();
+ return $childRow;
+ }
+
+ });
+
+})(jQuery);
\ No newline at end of file |