unsavedclass option

This commit is contained in:
vitalets 2013-01-17 00:14:07 +04:00
parent 22fdd0e8b6
commit 9c7a2bab60
5 changed files with 62 additions and 57 deletions

@ -4,6 +4,7 @@ X-editable changelog
Version 1.4.1 wip
----------------------------
[enh] new option `unsavedclass` to set css class when value was not sent to server (vitalets)
[enh] new option `emptyclass` to set css class when element is empty (vitalets)
[enh #59] select2 input (vitalets)
[enh #17] typeahead input (vitalets)

@ -110,18 +110,4 @@
.editable-clear-x:hover {
opacity: 1;
}
/*
.editable-clear-x1 {
background: url('../img/clear.png') center center no-repeat;
display: inline-block;
zoom: 1;
*display: inline;
width: 13px;
height: 13px;
vertical-align: middle;
position: relative;
margin-left: -20px;
}
*/
}

@ -228,6 +228,7 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc.
}
//if success callback returns object like {newValue: <something>} --> use that value instead of submitted
//it is usefull if you want to chnage value in url-function
if(res && typeof res === 'object' && res.hasOwnProperty('newValue')) {
newValue = res.newValue;
}

@ -546,6 +546,16 @@
ok(p.hasClass('editable-inline'), 'has inline class');
});
test("option 'inputclass'", function () {
var e = $('<a href="#" id="a" data-inputclass="span4"> </a>').appendTo('#qunit-fixture').editable();
e.click();
var p = tip(e);
ok(p.find('input[type=text]').hasClass('span4'), 'class set correctly');
p.find('.editable-cancel').click();
ok(!p.is(':visible'), 'popover was removed');
});
test("emptytext, emptyclass", function () {
var emptytext = 'empty!',
emptyclass = 'abc',
@ -589,6 +599,50 @@
equal(e.text(), emptytext, 'emptytext shown');
ok(e.hasClass(emptyclass), 'emptyclass added');
});
asyncTest("submit to url defined as function", function () {
expect(10);
var newText = 'qwe',
pass = false;
//should be called even without pk!
e = $('<a href="#" data-pk1="1" id="a"></a>').appendTo(fx).editable({
url: function(params) {
ok(this === e[0], 'scope is ok');
ok(params.value, newText, 'new text passed in users function');
if(!pass) {
var d = new $.Deferred;
return d.reject('my error');
}
}
});
e.click();
var p = tip(e);
ok(p.find('input[type=text]').length, 'input exists')
p.find('input').val(newText);
p.find('form').submit();
setTimeout(function() {
ok(p.is(':visible'), 'popover visible');
equal(p.find('.editable-error-block').text(), 'my error', 'error shown correctly');
pass = true;
newText = 'dfgd';
p.find('input').val(newText);
p.find('form').submit();
setTimeout(function() {
ok(!p.is(':visible'), 'popover closed');
equal(e.text(), newText, 'element text ok');
ok(!e.hasClass($.fn.editable.defaults.unsavedclass), 'no unsaved class');
e.remove();
start();
}, timeout);
}, timeout);
});
}(jQuery));

@ -16,16 +16,6 @@ $(function () {
p.find('.editable-cancel').click();
ok(!p.is(':visible'), 'popover was removed');
});
test("option 'inputclass'", function () {
var e = $('<a href="#" id="a" data-inputclass="span4"> </a>').appendTo('#qunit-fixture').editable();
e.click();
var p = tip(e);
ok(p.find('input[type=text]').hasClass('span4'), 'class set correctly');
p.find('.editable-cancel').click();
ok(!p.is(':visible'), 'popover was removed');
});
asyncTest("should load correct value and save new entered text (and value)", function () {
var v = 'ab<b>"',
@ -229,35 +219,6 @@ $(function () {
}, timeout);
});
asyncTest("submit to url defined as function", function () {
expect(4);
var newText = 'qwe',
//should be called even without pk!
e = $('<a href="#" data-pk1="1" id="a"></a>').appendTo(fx).editable({
url: function(params) {
ok(this === e[0], 'scope is ok');
ok(params.value, newText, 'new text passed in users function');
var d = new $.Deferred;
return d.reject('my error');
}
});
e.click();
var p = tip(e);
ok(p.find('input[type=text]').length, 'input exists')
p.find('input').val(newText);
p.find('form').submit();
setTimeout(function() {
equal(p.find('.editable-error-block').text(), 'my error', 'error shown correctly');
e.remove();
start();
}, timeout);
});
asyncTest("should show emptytext if entered text is empty", function () {
var emptytext = 'blabla',
@ -351,13 +312,14 @@ $(function () {
ok(!p.is(':visible'), 'popover was removed');
equal(e.data('editable').value, newText, 'new text saved to value');
equal(e.text(), newText, 'new text shown');
ok(e.hasClass('editable-unsaved'), 'has class editable-unsaved');
ok(e.hasClass($.fn.editable.defaults.unsavedclass), 'has class editable-unsaved');
});
test("send = 'never'. if pk defined --> should save new entered text and value, but no ajax", function () {
var e = $('<a href="#" data-name="text1">abc</a>').appendTo('#qunit-fixture').editable({
pk: 123,
send: 'never'
send: 'never',
unsavedclass: 'qq'
}),
newText = 'cde';
@ -370,7 +332,7 @@ $(function () {
ok(!p.is(':visible'), 'popover was removed');
equal(e.data('editable').value, newText, 'new text saved to value');
equal(e.text(), newText, 'new text shown');
ok(e.hasClass('editable-unsaved'), 'has class editable-unsaved');
ok(e.hasClass('qq'), 'has class editable-unsaved');
});
test("if name not defined --> should be taken from id", function () {
@ -423,6 +385,7 @@ $(function () {
ok(!p.is(':visible'), 'popover was removed');
ok(!e.text().length, 'element still empty, new value was not displayed');
equal(e.data('editable').value, newText, 'new text saved to value');
ok(!e.hasClass($.fn.editable.defaults.unsavedclass), 'no unsaved css');
e.remove();
start();
}, timeout);