library-mirrors/tablesorter
1
0
Fork 0
mirror of https://github.com/Mottie/tablesorter.git synced 2025-01-12 15:24:21 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Editable: update validate function to allow setting it per column

Browse Source
This commit is contained in:
Mottie 2014-08-26 14:23:13 -05:00
parent 3013ce278b
commit 8ddd3c76f2
2 changed files with 41 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
docs/example-widget-editable.html
View File

@ -243,18 +243,24 @@ td.no-edit, span.no-edit {
<tr id="editable-validate">
<td><a href="#" class="permalink">editable_validate</a></td>
<td>Validate the content change.
<td>Validate the content change (<span class="version updated">v2.17.8</span>)
<div class="collapsible">
<br>
Use this function to validate and/or modify the content before it is accepted.<br>
<br>
In <span class="version updated">v2.17.8</span>:
<ul>
<li>Set this option to be a global function, or an object containing a column index, or class name of the desired column</li>
<li>A <code>columnIndex</code> is now included in the function parameters</li>
</ul>
This function must return either a string containing the modified content or <code>false</code> to revert the content back to it's original value. Example:
<pre class="prettyprint lang-js">$(function(){
$('table').tablesorter({
$('#table1').tablesorter({
widgets : ['editable'],
widgetOptions : {
editable_validate : function(txt, orig){
// global validate function
editable_validate : function(txt, orig, columnIndex){
// only allow one word
var t = /\s/.test(txt) ? txt.split(/\s/)[0] : txt;
return t ? t : false;
@ -262,6 +268,25 @@ td.no-edit, span.no-edit {
}
});
$('#table2').tablesorter({
widgets : ['editable'],
widgetOptions : {
// validate function per column
editable_validate : {
0 : function(txt, orig, columnIndex){
// allow up to two words
var t = txt.split(' ');
return t.length > 2 ? t[0] + (t[1] ? ' ' + t[1] : '') : txt;
},
'.price' : function(txt, orig, columnIndex) {
// make sure the price column(s) are using a number
return isNaN( txt.replace(/[$,\s]/g, '') ) ? false : txt;
}
}
}
});
});</pre>
Default value: <code>null</code>
</div>

16
js/widgets/widget-editable.js
View File

@ -79,9 +79,10 @@
})
.on('blur focusout keydown '.split(' ').join('.tseditable '), '[contenteditable]', function(e){
if ( !c.$table.data('contentFocused') ) { return; }
var t,
var t, validate,
valid = false,
$this = $(e.target);
$this = $(e.target),
column = $this.closest('td').index();
if ( e.which === 27 ) {
// user cancelled
$this.html( $this.data('original') ).trigger('blur.tseditable');
@ -91,7 +92,16 @@
t = e.which === 13 && ( wo.editable_enterToAccept || e.altKey ) || wo.editable_autoAccept && e.type !== 'keydown';
// change if new or user hits enter (if option set)
if ( t && $this.data('before') !== $this.html() ) {
valid = $.isFunction(wo.editable_validate) ? wo.editable_validate( $this.html(), $this.data('original') ) : $this.html();
validate = wo.editable_validate;
valid = $this.html();
if (typeof(validate) === "function") {
valid = validate( $this.html(), $this.data('original'), column );
} else if (typeof (validate = $.tablesorter.getColumnData( table, validate, column )) === 'function') {
valid = validate( $this.html(), $this.data('original'), column );
}
if ( t && valid !== false ) {
c.$table.find('.tseditable-last-edited-cell').removeClass('tseditable-last-edited-cell');
$this