/************************************************************************ * 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; //Apply theming as same as parent table unless explicitily set if (tableOptions.jqueryuiTheme == undefined) { tableOptions.jqueryuiTheme = self.options.jqueryuiTheme; } //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 = $('
') .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); //Removed since it causes "Uncaught Error: cannot call methods on jtable prior to initialization; attempted to call method 'destroy'" $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 = $('') .addClass('jtable-child-row') .append(''); $row.after($childRow); $row.data('childRow', $childRow); $childRow.hide(); return $childRow; } }); })(jQuery);