diff --git a/jquery.tabledit.js b/jquery.tabledit.js index c4d1619..b9be252 100644 --- a/jquery.tabledit.js +++ b/jquery.tabledit.js @@ -95,14 +95,14 @@ if (typeof jQuery === 'undefined') { $td.each(function() { // Create hidden input with row identifier. - var span = '' + $(this).text() + ''; - var input = ''; + var span = '' + $.trim($(this).text()) + ''; + var input = ''; // Add elements to table cell. $(this).html(span + input); // Add attribute "id" to table row. - $(this).parent('tr').attr(settings.rowIdentifier, $(this).text()); + $(this).parent('tr').attr(settings.rowIdentifier, $.trim($(this).text())); }); }, editable: function() { @@ -111,7 +111,7 @@ if (typeof jQuery === 'undefined') { $td.each(function() { // Get text of this cell. - var text = $(this).text(); + var text = $.trim($(this).text()); // Add pointer as cursor. if (!settings.editButton) { @@ -128,6 +128,7 @@ if (typeof jQuery === 'undefined') { // Create options for select element. $.each(jQuery.parseJSON(settings.columns.editable[i][2]), function(index, value) { + value = $.trim(value); if (text === value) { input += ''; } else { @@ -139,7 +140,7 @@ if (typeof jQuery === 'undefined') { input += ''; } else { // Create text input element. - var input = ''; + var input = ''; } // Add elements and class "view" to table cell. @@ -256,7 +257,7 @@ if (typeof jQuery === 'undefined') { // Get input element. var $input = $(this).find('.tabledit-input'); // Get span text. - var text = $(this).find('.tabledit-span').text(); + var text = $.trim($(this).find('.tabledit-span').text()); // Set input/select value with span text. if ($input.is('select')) { $input.find('option').filter(function() { @@ -282,7 +283,7 @@ if (typeof jQuery === 'undefined') { var $input = $(this).find('.tabledit-input'); // Set span text with input/select new value. if ($input.is('select')) { - $(this).find('.tabledit-span').text($input.find('option:selected').text()); + $(this).find('.tabledit-span').text($.trim($input.find('option:selected').text())); } else { $(this).find('.tabledit-span').text($input.val()); } diff --git a/jquery.tabledit.min.js b/jquery.tabledit.min.js index 2d4b259..3fee842 100644 --- a/jquery.tabledit.min.js +++ b/jquery.tabledit.min.js @@ -3,4 +3,5 @@ * Copyright (c) 2015 Celso Marques * Licensed under MIT (https://github.com/markcell/jQuery-Tabledit/blob/master/LICENSE) */ -if("undefined"==typeof jQuery)throw new Error("Tabledit requires jQuery library.");!function(t){"use strict";t.fn.Tabledit=function(e){function n(e){var n=i.find(".tabledit-input").serialize()+"&action="+e,a=d.onAjax(e,n);if(a===!1)return!1;var l=t.post(d.url,n,function(t,n,a){e===d.buttons.edit.action&&(s.removeClass(d.dangerClass).addClass(d.warningClass),setTimeout(function(){i.find("tr."+d.warningClass).removeClass(d.warningClass)},1400)),d.onSuccess(t,n,a)},"json");return l.fail(function(t,n,i){e===d.buttons["delete"].action?(o.removeClass(d.mutedClass).addClass(d.dangerClass),o.find(".tabledit-toolbar button").attr("disabled",!1),o.find(".tabledit-toolbar .tabledit-restore-button").hide()):e===d.buttons.edit.action&&s.addClass(d.dangerClass),d.onFail(t,n,i)}),l.always(function(){d.onAlways()}),l}if(!this.is("table"))throw new Error("Tabledit only works when applied to a table.");var i=this,a={url:window.location.href,inputClass:"form-control input-sm",toolbarClass:"btn-toolbar",groupClass:"btn-group btn-group-sm",dangerClass:"danger",warningClass:"warning",mutedClass:"text-muted",eventType:"click",rowIdentifier:"id",hideIdentifier:!1,autoFocus:!0,editButton:!0,deleteButton:!0,saveButton:!0,restoreButton:!0,buttons:{edit:{"class":"btn btn-sm btn-default",html:'',action:"edit"},"delete":{"class":"btn btn-sm btn-default",html:'',action:"delete"},save:{"class":"btn btn-sm btn-success",html:"Save"},restore:{"class":"btn btn-sm btn-warning",html:"Restore",action:"restore"},confirm:{"class":"btn btn-sm btn-danger",html:"Confirm"}},onDraw:function(){},onSuccess:function(){},onFail:function(){},onAlways:function(){},onAjax:function(){}},d=t.extend(!0,a,e),s="undefined",o="undefined",l="undefined",r={columns:{identifier:function(){d.hideIdentifier&&i.find("th:nth-child("+parseInt(d.columns.identifier[0])+"1), tbody td:nth-child("+parseInt(d.columns.identifier[0])+"1)").hide();var e=i.find("tbody td:nth-child("+(parseInt(d.columns.identifier[0])+1)+")");e.each(function(){var e=''+t(this).text()+"",n='';t(this).html(e+n),t(this).parent("tr").attr(d.rowIdentifier,t(this).text())})},editable:function(){for(var e=0;e";if("undefined"!=typeof d.columns.editable[e][2]){var a='"}else var a='';t(this).html(i+a),t(this).addClass("tabledit-view-mode")})}},toolbar:function(){if(d.editButton||d.deleteButton){var t="",e="",n="",a="",s="";0===i.find("th.tabledit-toolbar-column").length&&i.find("tr:first").append(''),d.editButton&&(t='"),d.deleteButton&&(e='",s='"),d.editButton&&d.saveButton&&(n='"),d.deleteButton&&d.restoreButton&&(a='");var o='
\n
'+t+e+"
\n "+n+"\n "+s+"\n "+a+"\n
";i.find("tr:gt(0)").append(''+o+"")}}}},u={view:function(e){var n=t(e).parent("tr");t(e).parent("tr").find(".tabledit-input.tabledit-identifier").prop("disabled",!0),t(e).find(".tabledit-input").blur().hide().prop("disabled",!0),t(e).find(".tabledit-span").show(),t(e).addClass("tabledit-view-mode").removeClass("tabledit-edit-mode"),d.editButton&&(n.find("button.tabledit-save-button").hide(),n.find("button.tabledit-edit-button").removeClass("active").blur())},edit:function(e){c.reset(e);var n=t(e).parent("tr");n.find(".tabledit-input.tabledit-identifier").prop("disabled",!1),t(e).find(".tabledit-span").hide();var i=t(e).find(".tabledit-input");i.prop("disabled",!1).show(),d.autoFocus&&i.focus(),t(e).addClass("tabledit-edit-mode").removeClass("tabledit-view-mode"),d.editButton&&(n.find("button.tabledit-edit-button").addClass("active"),n.find("button.tabledit-save-button").show())}},b={reset:function(e){t(e).each(function(){var e=t(this).find(".tabledit-input"),n=t(this).find(".tabledit-span").text();e.is("select")?e.find("option").filter(function(){return t.trim(t(this).text())===n}).attr("selected",!0):e.val(n),u.view(this)})},submit:function(e){var i=n(d.buttons.edit.action);i!==!1&&(t(e).each(function(){var e=t(this).find(".tabledit-input");t(this).find(".tabledit-span").text(e.is("select")?e.find("option:selected").text():e.val()),u.view(this)}),s=t(e).parent("tr"))}},c={reset:function(t){i.find(".tabledit-confirm-button").hide(),i.find(".tabledit-delete-button").removeClass("active").blur()},submit:function(e){c.reset(e),t(e).parent("tr").find("input.tabledit-identifier").attr("disabled",!1);var i=n(d.buttons["delete"].action);t(e).parents("tr").find("input.tabledit-identifier").attr("disabled",!0),i!==!1&&(t(e).parent("tr").addClass("tabledit-deleted-row"),t(e).parent("tr").addClass(d.mutedClass).find(".tabledit-toolbar button:not(.tabledit-restore-button)").attr("disabled",!0),t(e).find(".tabledit-restore-button").show(),o=t(e).parent("tr"))},confirm:function(e){i.find("td.tabledit-edit-mode").each(function(){b.reset(this)}),t(e).find(".tabledit-delete-button").addClass("active"),t(e).find(".tabledit-confirm-button").show()},restore:function(e){t(e).parent("tr").find("input.tabledit-identifier").attr("disabled",!1);var i=n(d.buttons.restore.action);t(e).parents("tr").find("input.tabledit-identifier").attr("disabled",!0),i!==!1&&(t(e).parent("tr").removeClass("tabledit-deleted-row"),t(e).parent("tr").removeClass(d.mutedClass).find(".tabledit-toolbar button").attr("disabled",!1),t(e).find(".tabledit-restore-button").hide(),l=t(e).parent("tr"))}};return r.columns.identifier(),r.columns.editable(),r.columns.toolbar(),d.onDraw(),d.deleteButton&&(i.on("click","button.tabledit-delete-button",function(e){if(e.handled!==!0){e.preventDefault();var n=t(this).hasClass("active"),i=t(this).parents("td");c.reset(i),n||c.confirm(i),e.handled=!0}}),i.on("click","button.tabledit-confirm-button",function(e){if(e.handled!==!0){e.preventDefault();var n=t(this).parents("td");c.submit(n),e.handled=!0}})),d.restoreButton&&i.on("click","button.tabledit-restore-button",function(e){e.handled!==!0&&(e.preventDefault(),c.restore(t(this).parents("td")),e.handled=!0)}),d.editButton?(i.on("click","button.tabledit-edit-button",function(e){if(e.handled!==!0){e.preventDefault();var n=t(this),a=n.hasClass("active");b.reset(i.find("td.tabledit-edit-mode")),a||t(n.parents("tr").find("td.tabledit-view-mode").get().reverse()).each(function(){u.edit(this)}),e.handled=!0}}),i.on("click","button.tabledit-save-button",function(e){e.handled!==!0&&(e.preventDefault(),b.submit(t(this).parents("tr").find("td.tabledit-edit-mode")),e.handled=!0)})):(i.on(d.eventType,"tr:not(.tabledit-deleted-row) td.tabledit-view-mode",function(t){t.handled!==!0&&(t.preventDefault(),b.reset(i.find("td.tabledit-edit-mode")),u.edit(this),t.handled=!0)}),i.on("change","select.tabledit-input:visible",function(){event.handled!==!0&&(b.submit(t(this).parent("td")),event.handled=!0)}),t(document).on("click",function(t){var e=i.find(".tabledit-edit-mode");e.is(t.target)||0!==e.has(t.target).length||b.reset(i.find(".tabledit-input:visible").parent("td"))})),t(document).on("keyup",function(t){var e=i.find(".tabledit-input:visible"),n=i.find(".tabledit-confirm-button");if(e.length>0)var a=e.parents("td");else{if(!(n.length>0))return;var a=n.parents("td")}switch(t.keyCode){case 9:d.editButton||(b.submit(a),u.edit(a.closest("td").next()));break;case 13:b.submit(a);break;case 27:b.reset(a),c.reset(a)}}),this}}(jQuery); \ No newline at end of file +if (typeof jQuery === 'undefined') { hrow new Error('Tabledit requires jQuery library.'); }(function($) { 'use strict';$.fn.Tabledit = function(options) { if (!this.is('table')) { hrow new Error('Tabledit only works when applied to a table.'); }var $table = this;var defaults = { url: window.location.href, inputClass: 'form-control input-sm', oolbarClass: 'btn-toolbar', groupClass: 'btn-group btn-group-sm', dangerClass: 'danger', warningClass: 'warning', mutedClass: 'text-muted', eventType: 'click', rowIdentifier: 'id', hideIdentifier: false, autoFocus: true, editButton: true, deleteButton: true, saveButton: true, restoreButton: true, buttons: { edit: { class: 'btn btn-sm btn-default', html: '', action: 'edit' }, delete: { class: 'btn btn-sm btn-default', html: '', action: 'delete' }, save: { class: 'btn btn-sm btn-success', html: 'Save' }, restore: { class: 'btn btn-sm btn-warning', html: 'Restore', action: 'restore' }, confirm: { class: 'btn btn-sm btn-danger', html: 'Confirm' } }, onDraw: function() { return; }, onSuccess: function() { return; }, onFail: function() { return; }, onAlways: function() { return; }, onAjax: function() { return; } };var settings = $.extend(true, defaults, options);var $lastEditedRow = 'undefined'; var $lastDeletedRow = 'undefined'; var $lastRestoredRow = 'undefined';var Draw = { columns: { identifier: function() {if (settings.hideIdentifier) { $table.find('th:nth-child(' + parseInt(settings.columns.identifier[0]) + 1 + '), tbody td:nth-child(' + parseInt(settings.columns.identifier[0]) + 1 + ')').hide(); }var $td = $table.find('tbody td:nth-child(' + (parseInt(settings.columns.identifier[0]) + 1) + ')');$td.each(function() {var span = '' + $.trim($(this).text()) + ''; var input = ''; $(this).html(span + input); $(this).parent('tr').attr(settings.rowIdentifier, $.trim($(this).text())); }); }, editable: function() { for (var i = 0; i < settings.columns.editable.length; i++) { var $td = $table.find('tbody td:nth-child(' + (parseInt(settings.columns.editable[i][0]) + 1) + ')');$td.each(function() {var text = $.trim($(this).text()); if (!settings.editButton) { $(this).css('cursor', 'pointer'); } var span = '' + text + ''; if (typeof settings.columns.editable[i][2] !== 'undefined') {var input = ''; } else {var input = ''; } $(this).html(span + input); $(this).addClass('tabledit-view-mode'); }); } }, oolbar: function() { if (settings.editButton || settings.deleteButton) { var editButton = ''; var deleteButton = ''; var saveButton = ''; var restoreButton = ''; var confirmButton = ''; if ($table.find('th.tabledit-toolbar-column').length === 0) { $table.find('tr:first').append(''); } if (settings.editButton) { editButton = ''; } if (settings.deleteButton) { deleteButton = ''; confirmButton = ''; } if (settings.editButton && settings.saveButton) { saveButton = ''; } if (settings.deleteButton && settings.restoreButton) { restoreButton = ''; }var toolbar = '
\n\
' + editButton + deleteButton + '
\n\ ' + saveButton + '\n\ ' + confirmButton + '\n\ ' + restoreButton + '\n\
'; $table.find('tbody>tr').append('' + toolbar + ''); } } } }; var Mode = { view: function(td) {var $tr = $(td).parent('tr');$(td).parent('tr').find('.tabledit-input.tabledit-identifier').prop('disabled', true);$(td).find('.tabledit-input').blur().hide().prop('disabled', true);$(td).find('.tabledit-span').show();$(td).addClass('tabledit-view-mode').removeClass('tabledit-edit-mode');if (settings.editButton) { $tr.find('button.tabledit-save-button').hide(); $tr.find('button.tabledit-edit-button').removeClass('active').blur(); } }, edit: function(td) { Delete.reset(td);var $tr = $(td).parent('tr');$tr.find('.tabledit-input.tabledit-identifier').prop('disabled', false);$(td).find('.tabledit-span').hide();var $input = $(td).find('.tabledit-input');$input.prop('disabled', false).show();if (settings.autoFocus) { $input.focus(); }$(td).addClass('tabledit-edit-mode').removeClass('tabledit-view-mode');if (settings.editButton) { $tr.find('button.tabledit-edit-button').addClass('active'); $tr.find('button.tabledit-save-button').show(); } } }; var Edit = { reset: function(td) { $(td).each(function() {var $input = $(this).find('.tabledit-input');var text = $.trim($(this).find('.tabledit-span').text());if ($input.is('select')) { $input.find('option').filter(function() { return $.trim($(this).text()) === text; }).attr('selected', true); } else { $input.val(text); }Mode.view(this); }); }, submit: function(td) {var ajaxResult = ajax(settings.buttons.edit.action);if (ajaxResult === false) { return; }$(td).each(function() {var $input = $(this).find('.tabledit-input');if ($input.is('select')) { $(this).find('.tabledit-span').text($.trim($input.find('option:selected').text())); } else { $(this).find('.tabledit-span').text($input.val()); }Mode.view(this); }); $lastEditedRow = $(td).parent('tr'); } }; var Delete = { reset: function(td) {$table.find('.tabledit-confirm-button').hide();$table.find('.tabledit-delete-button').removeClass('active').blur(); }, submit: function(td) { Delete.reset(td);$(td).parent('tr').find('input.tabledit-identifier').attr('disabled', false);var ajaxResult = ajax(settings.buttons.delete.action);$(td).parents('tr').find('input.tabledit-identifier').attr('disabled', true);if (ajaxResult === false) { return; } $(td).parent('tr').addClass('tabledit-deleted-row');$(td).parent('tr').addClass(settings.mutedClass).find('.tabledit-toolbar button:not(.tabledit-restore-button)').attr('disabled', true);$(td).find('.tabledit-restore-button').show();$lastDeletedRow = $(td).parent('tr'); }, confirm: function(td) {$table.find('td.tabledit-edit-mode').each(function() { Edit.reset(this); });$(td).find('.tabledit-delete-button').addClass('active');$(td).find('.tabledit-confirm-button').show(); }, restore: function(td) {$(td).parent('tr').find('input.tabledit-identifier').attr('disabled', false);var ajaxResult = ajax(settings.buttons.restore.action);$(td).parents('tr').find('input.tabledit-identifier').attr('disabled', true);if (ajaxResult === false) { return; } $(td).parent('tr').removeClass('tabledit-deleted-row');$(td).parent('tr').removeClass(settings.mutedClass).find('.tabledit-toolbar button').attr('disabled', false);$(td).find('.tabledit-restore-button').hide();$lastRestoredRow = $(td).parent('tr'); } };function ajax(action) { var serialize = $table.find('.tabledit-input').serialize()if (!serialize) { return false; }serialize += '&action=' + action;var result = settings.onAjax(action, serialize);if (result === false) { return false; }var jqXHR = $.post(settings.url, serialize, function(data, textStatus, jqXHR) { if (action === settings.buttons.edit.action) { $lastEditedRow.removeClass(settings.dangerClass).addClass(settings.warningClass); setTimeout(function() {$table.find('tr.' + settings.warningClass).removeClass(settings.warningClass); }, 1400); }settings.onSuccess(data, textStatus, jqXHR); }, 'json');jqXHR.fail(function(jqXHR, textStatus, errorThrown) { if (action === settings.buttons.delete.action) { $lastDeletedRow.removeClass(settings.mutedClass).addClass(settings.dangerClass); $lastDeletedRow.find('.tabledit-toolbar button').attr('disabled', false); $lastDeletedRow.find('.tabledit-toolbar .tabledit-restore-button').hide(); } else if (action === settings.buttons.edit.action) { $lastEditedRow.addClass(settings.dangerClass); }settings.onFail(jqXHR, textStatus, errorThrown); });jqXHR.always(function() { settings.onAlways(); });return jqXHR; }Draw.columns.identifier(); Draw.columns.editable(); Draw.columns.toolbar();settings.onDraw();if (settings.deleteButton) { $table.on('click', 'button.tabledit-delete-button', function(event) { if (event.handled !== true) { event.preventDefault(); var activated = $(this).hasClass('active');var $td = $(this).parents('td');Delete.reset($td);if (!activated) { Delete.confirm($td); }event.handled = true; } });$table.on('click', 'button.tabledit-confirm-button', function(event) { if (event.handled !== true) { event.preventDefault();var $td = $(this).parents('td');Delete.submit($td);event.handled = true; } }); }if (settings.restoreButton) { $table.on('click', 'button.tabledit-restore-button', function(event) { if (event.handled !== true) { event.preventDefault();Delete.restore($(this).parents('td'));event.handled = true; } }); }if (settings.editButton) { $table.on('click', 'button.tabledit-edit-button', function(event) { if (event.handled !== true) { event.preventDefault();var $button = $(this); var activated = $button.hasClass('active'); Edit.reset($table.find('td.tabledit-edit-mode'));if (!activated) {$($button.parents('tr').find('td.tabledit-view-mode').get().reverse()).each(function() { Mode.edit(this); }); }event.handled = true; } }); $table.on('click', 'button.tabledit-save-button', function(event) { if (event.handled !== true) { event.preventDefault(); Edit.submit($(this).parents('tr').find('td.tabledit-edit-mode'));event.handled = true; } }); } else { $table.on(settings.eventType, 'tr:not(.tabledit-deleted-row) td.tabledit-view-mode', function(event) { if (event.handled !== true) { event.preventDefault(); Edit.reset($table.find('td.tabledit-edit-mode')); Mode.edit(this);event.handled = true; } }); $table.on('change', 'select.tabledit-input:visible', function(event) { if (event.handled !== true) {Edit.submit($(this).parent('td'));event.handled = true; } });$(document).on('click', function(event) { var $editMode = $table.find('.tabledit-edit-mode');if (!$editMode.is(event.target) && $editMode.has(event.target).length === 0) { Edit.reset($table.find('.tabledit-input:visible').parent('td')); } }); }$(document).on('keyup', function(event) {var $input = $table.find('.tabledit-input:visible'); var $button = $table.find('.tabledit-confirm-button');if ($input.length > 0) { var $td = $input.parents('td'); } else if ($button.length > 0) { var $td = $button.parents('td'); } else { return; } switch (event.keyCode) { case 9: if (!settings.editButton) { Edit.submit($td); Mode.edit($td.closest('td').next()); } break; case 13:Edit.submit($td); break; case 27:Edit.reset($td); Delete.reset($td); break; } });return this; }; }(jQuery)); +