mirror of
https://github.com/tuxis-ie/nsedit.git
synced 2025-05-23 00:15:22 +03:00
Merge commit '8997d5b1ff' as 'jtable'
This commit is contained in:
Mark Schouten
commit
d90fb0d2a6
155 changed files with 22323 additions and 0 deletions
432
jtable/dev/jquery.jtable.deletion.js
Normal file
432
jtable/dev/jquery.jtable.deletion.js
Normal file
|
|
@ -0,0 +1,432 @@
|
|||
/************************************************************************
|
||||
* DELETION extension for jTable *
|
||||
*************************************************************************/
|
||||
(function ($) {
|
||||
|
||||
//Reference to base object members
|
||||
var base = {
|
||||
_create: $.hik.jtable.prototype._create,
|
||||
_addColumnsToHeaderRow: $.hik.jtable.prototype._addColumnsToHeaderRow,
|
||||
_addCellsToRowUsingRecord: $.hik.jtable.prototype._addCellsToRowUsingRecord
|
||||
};
|
||||
|
||||
//extension members
|
||||
$.extend(true, $.hik.jtable.prototype, {
|
||||
|
||||
/************************************************************************
|
||||
* DEFAULT OPTIONS / EVENTS *
|
||||
*************************************************************************/
|
||||
options: {
|
||||
|
||||
//Options
|
||||
deleteConfirmation: true,
|
||||
|
||||
//Events
|
||||
recordDeleted: function (event, data) { },
|
||||
|
||||
//Localization
|
||||
messages: {
|
||||
deleteConfirmation: 'This record will be deleted. Are you sure?',
|
||||
deleteText: 'Delete',
|
||||
deleting: 'Deleting',
|
||||
canNotDeletedRecords: 'Can not delete {0} of {1} records!',
|
||||
deleteProggress: 'Deleting {0} of {1} records, processing...'
|
||||
}
|
||||
},
|
||||
|
||||
/************************************************************************
|
||||
* PRIVATE FIELDS *
|
||||
*************************************************************************/
|
||||
|
||||
_$deleteRecordDiv: null, //Reference to the adding new record dialog div (jQuery object)
|
||||
_$deletingRow: null, //Reference to currently deleting row (jQuery object)
|
||||
|
||||
/************************************************************************
|
||||
* CONSTRUCTOR *
|
||||
*************************************************************************/
|
||||
|
||||
/* Overrides base method to do deletion-specific constructions.
|
||||
*************************************************************************/
|
||||
_create: function () {
|
||||
base._create.apply(this, arguments);
|
||||
this._createDeleteDialogDiv();
|
||||
},
|
||||
|
||||
/* Creates and prepares delete record confirmation dialog div.
|
||||
*************************************************************************/
|
||||
_createDeleteDialogDiv: function () {
|
||||
var self = this;
|
||||
|
||||
//Check if deleteAction is supplied
|
||||
if (!self.options.actions.deleteAction) {
|
||||
return;
|
||||
}
|
||||
|
||||
//Create div element for delete confirmation dialog
|
||||
self._$deleteRecordDiv = $('<div><p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span><span class="jtable-delete-confirm-message"></span></p></div>').appendTo(self._$mainContainer);
|
||||
|
||||
//Prepare dialog
|
||||
self._$deleteRecordDiv.dialog({
|
||||
autoOpen: false,
|
||||
show: self.options.dialogShowEffect,
|
||||
hide: self.options.dialogHideEffect,
|
||||
modal: true,
|
||||
title: self.options.messages.areYouSure,
|
||||
buttons:
|
||||
[{ //cancel button
|
||||
text: self.options.messages.cancel,
|
||||
click: function () {
|
||||
self._$deleteRecordDiv.dialog("close");
|
||||
}
|
||||
}, {//delete button
|
||||
id: 'DeleteDialogButton',
|
||||
text: self.options.messages.deleteText,
|
||||
click: function () {
|
||||
|
||||
//row maybe removed by another source, if so, do nothing
|
||||
if (self._$deletingRow.hasClass('jtable-row-removed')) {
|
||||
self._$deleteRecordDiv.dialog('close');
|
||||
return;
|
||||
}
|
||||
|
||||
var $deleteButton = self._$deleteRecordDiv.parent().find('#DeleteDialogButton');
|
||||
self._setEnabledOfDialogButton($deleteButton, false, self.options.messages.deleting);
|
||||
self._deleteRecordFromServer(
|
||||
self._$deletingRow,
|
||||
function () {
|
||||
self._removeRowsFromTableWithAnimation(self._$deletingRow);
|
||||
self._$deleteRecordDiv.dialog('close');
|
||||
},
|
||||
function (message) { //error
|
||||
self._showError(message);
|
||||
self._setEnabledOfDialogButton($deleteButton, true, self.options.messages.deleteText);
|
||||
}
|
||||
);
|
||||
}
|
||||
}],
|
||||
close: function () {
|
||||
var $deleteButton = self._$deleteRecordDiv.parent().find('#DeleteDialogButton');
|
||||
self._setEnabledOfDialogButton($deleteButton, true, self.options.messages.deleteText);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/************************************************************************
|
||||
* PUBLIC METHODS *
|
||||
*************************************************************************/
|
||||
|
||||
/* This method is used to delete one or more rows from server and the table.
|
||||
*************************************************************************/
|
||||
deleteRows: function ($rows) {
|
||||
var self = this;
|
||||
|
||||
if ($rows.length <= 0) {
|
||||
self._logWarn('No rows specified to jTable deleteRows method.');
|
||||
return;
|
||||
}
|
||||
|
||||
if (self._isBusy()) {
|
||||
self._logWarn('Can not delete rows since jTable is busy!');
|
||||
return;
|
||||
}
|
||||
|
||||
//Deleting just one row
|
||||
if ($rows.length == 1) {
|
||||
self._deleteRecordFromServer(
|
||||
$rows,
|
||||
function () { //success
|
||||
self._removeRowsFromTableWithAnimation($rows);
|
||||
},
|
||||
function (message) { //error
|
||||
self._showError(message);
|
||||
}
|
||||
);
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
//Deleting multiple rows
|
||||
self._showBusy(self._formatString(self.options.messages.deleteProggress, 0, $rows.length));
|
||||
|
||||
//This method checks if deleting of all records is completed
|
||||
var completedCount = 0;
|
||||
var isCompleted = function () {
|
||||
return (completedCount >= $rows.length);
|
||||
};
|
||||
|
||||
//This method is called when deleting of all records completed
|
||||
var completed = function () {
|
||||
var $deletedRows = $rows.filter('.jtable-row-ready-to-remove');
|
||||
if ($deletedRows.length < $rows.length) {
|
||||
self._showError(self._formatString(self.options.messages.canNotDeletedRecords, $rows.length - $deletedRows.length, $rows.length));
|
||||
}
|
||||
|
||||
if ($deletedRows.length > 0) {
|
||||
self._removeRowsFromTableWithAnimation($deletedRows);
|
||||
}
|
||||
|
||||
self._hideBusy();
|
||||
};
|
||||
|
||||
//Delete all rows
|
||||
var deletedCount = 0;
|
||||
$rows.each(function () {
|
||||
var $row = $(this);
|
||||
self._deleteRecordFromServer(
|
||||
$row,
|
||||
function () { //success
|
||||
++deletedCount; ++completedCount;
|
||||
$row.addClass('jtable-row-ready-to-remove');
|
||||
self._showBusy(self._formatString(self.options.messages.deleteProggress, deletedCount, $rows.length));
|
||||
if (isCompleted()) {
|
||||
completed();
|
||||
}
|
||||
},
|
||||
function () { //error
|
||||
++completedCount;
|
||||
if (isCompleted()) {
|
||||
completed();
|
||||
}
|
||||
}
|
||||
);
|
||||
});
|
||||
},
|
||||
|
||||
/* Deletes a record from the table (optionally from the server also).
|
||||
*************************************************************************/
|
||||
deleteRecord: function (options) {
|
||||
var self = this;
|
||||
options = $.extend({
|
||||
clientOnly: false,
|
||||
animationsEnabled: self.options.animationsEnabled,
|
||||
url: self.options.actions.deleteAction,
|
||||
success: function () { },
|
||||
error: function () { }
|
||||
}, options);
|
||||
|
||||
if (options.key == undefined) {
|
||||
self._logWarn('options parameter in deleteRecord method must contain a key property.');
|
||||
return;
|
||||
}
|
||||
|
||||
var $deletingRow = self.getRowByKey(options.key);
|
||||
if ($deletingRow == null) {
|
||||
self._logWarn('Can not found any row by key: ' + options.key);
|
||||
return;
|
||||
}
|
||||
|
||||
if (options.clientOnly) {
|
||||
self._removeRowsFromTableWithAnimation($deletingRow, options.animationsEnabled);
|
||||
options.success();
|
||||
return;
|
||||
}
|
||||
|
||||
self._deleteRecordFromServer(
|
||||
$deletingRow,
|
||||
function (data) { //success
|
||||
self._removeRowsFromTableWithAnimation($deletingRow, options.animationsEnabled);
|
||||
options.success(data);
|
||||
},
|
||||
function (message) { //error
|
||||
self._showError(message);
|
||||
options.error(message);
|
||||
},
|
||||
options.url
|
||||
);
|
||||
},
|
||||
|
||||
/************************************************************************
|
||||
* OVERRIDED METHODS *
|
||||
*************************************************************************/
|
||||
|
||||
/* Overrides base method to add a 'deletion column cell' to header row.
|
||||
*************************************************************************/
|
||||
_addColumnsToHeaderRow: function ($tr) {
|
||||
base._addColumnsToHeaderRow.apply(this, arguments);
|
||||
if (this.options.actions.deleteAction != undefined) {
|
||||
$tr.append(this._createEmptyCommandHeader());
|
||||
}
|
||||
},
|
||||
|
||||
/* Overrides base method to add a 'delete command cell' to a row.
|
||||
*************************************************************************/
|
||||
_addCellsToRowUsingRecord: function ($row) {
|
||||
base._addCellsToRowUsingRecord.apply(this, arguments);
|
||||
|
||||
var self = this;
|
||||
if (self.options.actions.deleteAction != undefined) {
|
||||
var $span = $('<span></span>').html(self.options.messages.deleteText);
|
||||
var $button = $('<button title="' + self.options.messages.deleteText + '"></button>')
|
||||
.addClass('jtable-command-button jtable-delete-command-button')
|
||||
.append($span)
|
||||
.click(function (e) {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
self._deleteButtonClickedForRow($row);
|
||||
});
|
||||
$('<td></td>')
|
||||
.addClass('jtable-command-column')
|
||||
.append($button)
|
||||
.appendTo($row);
|
||||
}
|
||||
},
|
||||
|
||||
/************************************************************************
|
||||
* PRIVATE METHODS *
|
||||
*************************************************************************/
|
||||
|
||||
/* This method is called when user clicks delete button on a row.
|
||||
*************************************************************************/
|
||||
_deleteButtonClickedForRow: function ($row) {
|
||||
var self = this;
|
||||
|
||||
var deleteConfirm;
|
||||
var deleteConfirmMessage = self.options.messages.deleteConfirmation;
|
||||
|
||||
//If options.deleteConfirmation is function then call it
|
||||
if ($.isFunction(self.options.deleteConfirmation)) {
|
||||
var data = { row: $row, record: $row.data('record'), deleteConfirm: true, deleteConfirmMessage: deleteConfirmMessage, cancel: false, cancelMessage: null };
|
||||
self.options.deleteConfirmation(data);
|
||||
|
||||
//If delete progress is cancelled
|
||||
if (data.cancel) {
|
||||
|
||||
//If a canlellation reason is specified
|
||||
if (data.cancelMessage) {
|
||||
self._showError(data.cancelMessage); //TODO: show warning/stop message instead of error (also show warning/error ui icon)!
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
deleteConfirmMessage = data.deleteConfirmMessage;
|
||||
deleteConfirm = data.deleteConfirm;
|
||||
} else {
|
||||
deleteConfirm = self.options.deleteConfirmation;
|
||||
}
|
||||
|
||||
if (deleteConfirm != false) {
|
||||
//Confirmation
|
||||
self._$deleteRecordDiv.find('.jtable-delete-confirm-message').html(deleteConfirmMessage);
|
||||
self._showDeleteDialog($row);
|
||||
} else {
|
||||
//No confirmation
|
||||
self._deleteRecordFromServer(
|
||||
$row,
|
||||
function () { //success
|
||||
self._removeRowsFromTableWithAnimation($row);
|
||||
},
|
||||
function (message) { //error
|
||||
self._showError(message);
|
||||
}
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
/* Shows delete comfirmation dialog.
|
||||
*************************************************************************/
|
||||
_showDeleteDialog: function ($row) {
|
||||
this._$deletingRow = $row;
|
||||
this._$deleteRecordDiv.dialog('open');
|
||||
},
|
||||
|
||||
/* Performs an ajax call to server to delete record
|
||||
* and removes row of the record from table if ajax call success.
|
||||
*************************************************************************/
|
||||
_deleteRecordFromServer: function ($row, success, error, url) {
|
||||
var self = this;
|
||||
|
||||
var completeDelete = function(data) {
|
||||
if (data.Result != 'OK') {
|
||||
$row.data('deleting', false);
|
||||
if (error) {
|
||||
error(data.Message);
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
self._trigger("recordDeleted", null, { record: $row.data('record'), row: $row, serverResponse: data });
|
||||
|
||||
if (success) {
|
||||
success(data);
|
||||
}
|
||||
};
|
||||
|
||||
//Check if it is already being deleted right now
|
||||
if ($row.data('deleting') == true) {
|
||||
return;
|
||||
}
|
||||
|
||||
$row.data('deleting', true);
|
||||
|
||||
var postData = {};
|
||||
postData[self._keyField] = self._getKeyValueOfRecord($row.data('record'));
|
||||
|
||||
//deleteAction may be a function, check if it is
|
||||
if (!url && $.isFunction(self.options.actions.deleteAction)) {
|
||||
|
||||
//Execute the function
|
||||
var funcResult = self.options.actions.deleteAction(postData);
|
||||
|
||||
//Check if result is a jQuery Deferred object
|
||||
if (self._isDeferredObject(funcResult)) {
|
||||
//Wait promise
|
||||
funcResult.done(function (data) {
|
||||
completeDelete(data);
|
||||
}).fail(function () {
|
||||
$row.data('deleting', false);
|
||||
if (error) {
|
||||
error(self.options.messages.serverCommunicationError);
|
||||
}
|
||||
});
|
||||
} else { //assume it returned the deletion result
|
||||
completeDelete(funcResult);
|
||||
}
|
||||
|
||||
} else { //Assume it's a URL string
|
||||
//Make ajax call to delete the record from server
|
||||
this._ajax({
|
||||
url: (url || self.options.actions.deleteAction),
|
||||
data: postData,
|
||||
success: function (data) {
|
||||
completeDelete(data);
|
||||
},
|
||||
error: function () {
|
||||
$row.data('deleting', false);
|
||||
if (error) {
|
||||
error(self.options.messages.serverCommunicationError);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
/* Removes a row from table after a 'deleting' animation.
|
||||
*************************************************************************/
|
||||
_removeRowsFromTableWithAnimation: function ($rows, animationsEnabled) {
|
||||
var self = this;
|
||||
|
||||
if (animationsEnabled == undefined) {
|
||||
animationsEnabled = self.options.animationsEnabled;
|
||||
}
|
||||
|
||||
if (animationsEnabled) {
|
||||
var className = 'jtable-row-deleting';
|
||||
if (this.options.jqueryuiTheme) {
|
||||
className = className + ' ui-state-disabled';
|
||||
}
|
||||
|
||||
//Stop current animation (if does exists) and begin 'deleting' animation.
|
||||
$rows.stop(true, true).addClass(className, 'slow', '').promise().done(function () {
|
||||
self._removeRowsFromTable($rows, 'deleted');
|
||||
});
|
||||
} else {
|
||||
self._removeRowsFromTable($rows, 'deleted');
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
Loading…
Add table
Add a link
Reference in a new issue