This commit is contained in:
vitalets 2013-09-30 23:07:45 +04:00
parent af4e7c148e
commit 9678bd8c22
17 changed files with 1597 additions and 139 deletions

8
dist/CHANGELOG.txt vendored

@ -1,8 +1,14 @@
X-editable changelog
=============================
Version 1.4.7 wip
Version 1.5.0 wip
----------------------------
[enh #362] add twitter typeahead.js (vitalets)
[enh] select: add `sourceOptions` to modify source request method and params (vitalets)
[enh #377] add bool option `escape` to allow html as content (vitalets)
[bug #344] fix determing empty for html content (vitalets)
[enh] update select2 to 3.4.3 (vitalets)
[enh #343] Bootstrap 3 support (vitalets)
Version 1.4.6 Aug 8, 2013

@ -1,4 +1,4 @@
/*! X-editable - v1.4.7
/*! X-editable - v1.5.0
* In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
* http://github.com/vitalets/x-editable
* Copyright (c) 2013 Vitaliy Potapov; Licensed MIT */

@ -1,4 +1,4 @@
/*! X-editable - v1.4.7
/*! X-editable - v1.5.0
* In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
* http://github.com/vitalets/x-editable
* Copyright (c) 2013 Vitaliy Potapov; Licensed MIT */
@ -623,7 +623,7 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc.
$.fn.editableform.errorBlockClass = 'editable-error';
//engine
$.fn.editableform.engine = 'jqeury';
$.fn.editableform.engine = 'jquery';
}(window.jQuery));
/**
@ -1732,13 +1732,12 @@ Makes editable any HTML element on the page. Applied as jQuery method.
this.isEmpty = isEmpty;
} else {
//detect empty
if($.trim(this.$element.html()) === '') {
this.isEmpty = true;
} else if($.trim(this.$element.text()) !== '') {
this.isEmpty = false;
//for some inputs we need more smart check
//e.g. wysihtml5 may have <br>, <p></p>, <img>
if(typeof(this.input.isEmpty) === 'function') {
this.isEmpty = this.input.isEmpty(this.$element);
} else {
//e.g. '<img>'
this.isEmpty = !this.$element.height() || !this.$element.width();
this.isEmpty = $.trim(this.$element.html()) === '';
}
}
@ -2313,7 +2312,7 @@ To create your own input you can inherit from this class.
@param {DOMElement} element
**/
value2html: function(value, element) {
$(element).text($.trim(value));
$(element)[this.options.escape ? 'text' : 'html']($.trim(value));
},
/**
@ -2455,6 +2454,19 @@ To create your own input you can inherit from this class.
@default null
**/
inputclass: null,
/**
If `true` - html will be escaped in content of element via $.text() method.
If `false` - html will not be escaped, $.html() used.
When you use own `display` function, this option has no influence.
@property escape
@type boolean
@since 1.5.0
@default true
**/
escape: true,
//scope for external methods (e.g. source defined as function)
//for internal use only
scope: null,
@ -2586,8 +2598,8 @@ List - abstract class for inputs that have source option loaded from js array or
}
}
//loading sourceData from server
$.ajax({
//ajaxOptions for source. Can be overwritten bt options.sourceOptions
var ajaxOptions = $.extend({
url: source,
type: 'get',
cache: false,
@ -2622,7 +2634,11 @@ List - abstract class for inputs that have source option loaded from js array or
$.each(cache.err_callbacks, function () { this.call(); });
}
}, this)
});
}, this.options.sourceOptions);
//loading sourceData from server
$.ajax(ajaxOptions);
} else { //options as json/array
this.sourceData = this.makeArray(source);
@ -2782,7 +2798,17 @@ List - abstract class for inputs that have source option loaded from js array or
@default true
@since 1.2.0
**/
sourceCache: true
sourceCache: true,
/**
Additional ajax options to be used in $.ajax() when loading list from server.
Useful to send extra parameters (`data` key) or change request method (`type` key).
@property sourceOptions
@type object|function
@default null
@since 1.5.0
**/
sourceOptions: null
});
$.fn.editabletypes.list = List;
@ -3110,7 +3136,8 @@ $(function(){
text = items[0].text;
}
$(element).text(text);
//$(element).text(text);
$.fn.editabletypes.abstractinput.prototype.value2html.call(this, text, element);
},
autosubmit: function() {
@ -3234,10 +3261,14 @@ $(function(){
//collect text of checked boxes
value2htmlFinal: function(value, element) {
var html = [],
checked = $.fn.editableutils.itemsByValue(value, this.sourceData);
checked = $.fn.editableutils.itemsByValue(value, this.sourceData),
escape = this.options.escape;
if(checked.length) {
$.each(checked, function(i, v) { html.push($.fn.editableutils.escape(v.text)); });
$.each(checked, function(i, v) {
var text = escape ? $.fn.editableutils.escape(v.text) : v.text;
html.push(text);
});
$(element).html(html.join('<br>'));
} else {
$(element).empty();
@ -3507,7 +3538,7 @@ Time
/**
Select2 input. Based on amazing work of Igor Vaynberg https://github.com/ivaynberg/select2.
Please see [original select2 docs](http://ivaynberg.github.com/select2) for detailed description and options.
Compatible **select2 version is 3.4.1**!
You should manually download and include select2 distributive:
<link href="select2/select2.css" rel="stylesheet" type="text/css"></link>
@ -3648,9 +3679,11 @@ $(function(){
$.extend(Constructor.prototype, {
render: function() {
this.setClass();
//apply select2
this.$input.select2(this.options.select2);
//can not apply select2 here as it calls initSelection
//over input that does not have correct value yet.
//apply select2 only in value2input
//this.$input.select2(this.options.select2);
//when data is loaded via ajax, we need to know when it's done to populate listData
if(this.isRemote) {
@ -3678,7 +3711,8 @@ $(function(){
} else if(this.sourceData) {
data = $.fn.editableutils.itemsByValue(value, this.sourceData, this.idFunc);
} else {
//can not get list of possible values (e.g. autotext for select2 with ajax source)
//can not get list of possible values
//(e.g. autotext for select2 with ajax source)
}
//data may be array (when multiple values allowed)
@ -3694,7 +3728,8 @@ $(function(){
text = $.isArray(text) ? text.join(this.options.viewseparator) : text;
$(element).text(text);
//$(element).text(text);
Constructor.superclass.value2html.call(this, text, element);
},
html2value: function(html) {
@ -3713,8 +3748,14 @@ $(function(){
}
*/
//for remote source just set value, text is updated by initSelection
this.$input.val(value).trigger('change', true); //second argument needed to separate initial change from user's click (for autosubmit)
//for remote source just set value, text is updated by initSelection
if(!this.$input.data('select2')) {
this.$input.val(value);
this.$input.select2(this.options.select2);
} else {
//second argument needed to separate initial change from user's click (for autosubmit)
this.$input.val(value).trigger('change', true);
}
//if remote source AND no user's initSelection provided --> try to use element's text
if(this.isRemote && !this.isMultiple && !this.options.select2.initSelection) {
@ -3722,7 +3763,7 @@ $(function(){
customText = this.options.select2.formatSelection;
if(!customId && !customText) {
var data = {id: value, text: $(this.options.scope).text()};
this.$input.select2('data', data);
this.$input.select2('data', data);
}
}
},
@ -3811,7 +3852,7 @@ $(function(){
E.g. `[{id: 1, text: "text1"}, {id: 2, text: "text2"}, ...]`.
@property source
@type array
@type array|string|function
@default null
**/
source: null,
@ -4372,7 +4413,8 @@ $(function(){
value2html: function(value, element) {
var text = value ? value.format(this.options.viewformat) : '';
$(element).text(text);
//$(element).text(text);
Constructor.superclass.value2html.call(this, text, element);
},
html2value: function(html) {
@ -6044,7 +6086,7 @@ $(function(){
value2html: function(value, element) {
var text = value ? this.dpg.formatDate(value, this.parsedViewFormat, this.options.datepicker.language) : '';
Date.superclass.value2html(text, element);
Date.superclass.value2html.call(this, text, element);
},
html2value: function(html) {
@ -6366,7 +6408,7 @@ $(function(){
//formatDate works with UTCDate!
var text = value ? this.dpg.formatDate(this.toUTC(value), this.parsedViewFormat, this.options.datetimepicker.language, this.options.formatType) : '';
if(element) {
DateTime.superclass.value2html(text, element);
DateTime.superclass.value2html.call(this, text, element);
} else {
return text;
}
@ -6662,10 +6704,9 @@ $(function(){
value2htmlFinal: function(value, element) {
if(this.getIsObjects()) {
var items = $.fn.editableutils.itemsByValue(value, this.sourceData);
$(element).text(items.length ? items[0].text : '');
} else {
$(element).text(value);
}
value = items.length ? items[0].text : '';
}
$.fn.editabletypes.abstractinput.prototype.value2html.call(this, value, element);
},
html2value: function (html) {

File diff suppressed because one or more lines are too long

@ -1,4 +1,4 @@
/*! X-editable - v1.4.7
/*! X-editable - v1.5.0
* In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
* http://github.com/vitalets/x-editable
* Copyright (c) 2013 Vitaliy Potapov; Licensed MIT */

@ -1,4 +1,4 @@
/*! X-editable - v1.4.7
/*! X-editable - v1.5.0
* In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
* http://github.com/vitalets/x-editable
* Copyright (c) 2013 Vitaliy Potapov; Licensed MIT */
@ -623,7 +623,7 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc.
$.fn.editableform.errorBlockClass = 'editable-error';
//engine
$.fn.editableform.engine = 'jqeury';
$.fn.editableform.engine = 'jquery';
}(window.jQuery));
/**
@ -1732,13 +1732,12 @@ Makes editable any HTML element on the page. Applied as jQuery method.
this.isEmpty = isEmpty;
} else {
//detect empty
if($.trim(this.$element.html()) === '') {
this.isEmpty = true;
} else if($.trim(this.$element.text()) !== '') {
this.isEmpty = false;
//for some inputs we need more smart check
//e.g. wysihtml5 may have <br>, <p></p>, <img>
if(typeof(this.input.isEmpty) === 'function') {
this.isEmpty = this.input.isEmpty(this.$element);
} else {
//e.g. '<img>'
this.isEmpty = !this.$element.height() || !this.$element.width();
this.isEmpty = $.trim(this.$element.html()) === '';
}
}
@ -2313,7 +2312,7 @@ To create your own input you can inherit from this class.
@param {DOMElement} element
**/
value2html: function(value, element) {
$(element).text($.trim(value));
$(element)[this.options.escape ? 'text' : 'html']($.trim(value));
},
/**
@ -2455,6 +2454,19 @@ To create your own input you can inherit from this class.
@default null
**/
inputclass: null,
/**
If `true` - html will be escaped in content of element via $.text() method.
If `false` - html will not be escaped, $.html() used.
When you use own `display` function, this option has no influence.
@property escape
@type boolean
@since 1.5.0
@default true
**/
escape: true,
//scope for external methods (e.g. source defined as function)
//for internal use only
scope: null,
@ -2586,8 +2598,8 @@ List - abstract class for inputs that have source option loaded from js array or
}
}
//loading sourceData from server
$.ajax({
//ajaxOptions for source. Can be overwritten bt options.sourceOptions
var ajaxOptions = $.extend({
url: source,
type: 'get',
cache: false,
@ -2622,7 +2634,11 @@ List - abstract class for inputs that have source option loaded from js array or
$.each(cache.err_callbacks, function () { this.call(); });
}
}, this)
});
}, this.options.sourceOptions);
//loading sourceData from server
$.ajax(ajaxOptions);
} else { //options as json/array
this.sourceData = this.makeArray(source);
@ -2782,7 +2798,17 @@ List - abstract class for inputs that have source option loaded from js array or
@default true
@since 1.2.0
**/
sourceCache: true
sourceCache: true,
/**
Additional ajax options to be used in $.ajax() when loading list from server.
Useful to send extra parameters (`data` key) or change request method (`type` key).
@property sourceOptions
@type object|function
@default null
@since 1.5.0
**/
sourceOptions: null
});
$.fn.editabletypes.list = List;
@ -3110,7 +3136,8 @@ $(function(){
text = items[0].text;
}
$(element).text(text);
//$(element).text(text);
$.fn.editabletypes.abstractinput.prototype.value2html.call(this, text, element);
},
autosubmit: function() {
@ -3234,10 +3261,14 @@ $(function(){
//collect text of checked boxes
value2htmlFinal: function(value, element) {
var html = [],
checked = $.fn.editableutils.itemsByValue(value, this.sourceData);
checked = $.fn.editableutils.itemsByValue(value, this.sourceData),
escape = this.options.escape;
if(checked.length) {
$.each(checked, function(i, v) { html.push($.fn.editableutils.escape(v.text)); });
$.each(checked, function(i, v) {
var text = escape ? $.fn.editableutils.escape(v.text) : v.text;
html.push(text);
});
$(element).html(html.join('<br>'));
} else {
$(element).empty();
@ -3507,7 +3538,7 @@ Time
/**
Select2 input. Based on amazing work of Igor Vaynberg https://github.com/ivaynberg/select2.
Please see [original select2 docs](http://ivaynberg.github.com/select2) for detailed description and options.
Compatible **select2 version is 3.4.1**!
You should manually download and include select2 distributive:
<link href="select2/select2.css" rel="stylesheet" type="text/css"></link>
@ -3648,9 +3679,11 @@ $(function(){
$.extend(Constructor.prototype, {
render: function() {
this.setClass();
//apply select2
this.$input.select2(this.options.select2);
//can not apply select2 here as it calls initSelection
//over input that does not have correct value yet.
//apply select2 only in value2input
//this.$input.select2(this.options.select2);
//when data is loaded via ajax, we need to know when it's done to populate listData
if(this.isRemote) {
@ -3678,7 +3711,8 @@ $(function(){
} else if(this.sourceData) {
data = $.fn.editableutils.itemsByValue(value, this.sourceData, this.idFunc);
} else {
//can not get list of possible values (e.g. autotext for select2 with ajax source)
//can not get list of possible values
//(e.g. autotext for select2 with ajax source)
}
//data may be array (when multiple values allowed)
@ -3694,7 +3728,8 @@ $(function(){
text = $.isArray(text) ? text.join(this.options.viewseparator) : text;
$(element).text(text);
//$(element).text(text);
Constructor.superclass.value2html.call(this, text, element);
},
html2value: function(html) {
@ -3713,8 +3748,14 @@ $(function(){
}
*/
//for remote source just set value, text is updated by initSelection
this.$input.val(value).trigger('change', true); //second argument needed to separate initial change from user's click (for autosubmit)
//for remote source just set value, text is updated by initSelection
if(!this.$input.data('select2')) {
this.$input.val(value);
this.$input.select2(this.options.select2);
} else {
//second argument needed to separate initial change from user's click (for autosubmit)
this.$input.val(value).trigger('change', true);
}
//if remote source AND no user's initSelection provided --> try to use element's text
if(this.isRemote && !this.isMultiple && !this.options.select2.initSelection) {
@ -3722,7 +3763,7 @@ $(function(){
customText = this.options.select2.formatSelection;
if(!customId && !customText) {
var data = {id: value, text: $(this.options.scope).text()};
this.$input.select2('data', data);
this.$input.select2('data', data);
}
}
},
@ -3811,7 +3852,7 @@ $(function(){
E.g. `[{id: 1, text: "text1"}, {id: 2, text: "text2"}, ...]`.
@property source
@type array
@type array|string|function
@default null
**/
source: null,
@ -4372,7 +4413,8 @@ $(function(){
value2html: function(value, element) {
var text = value ? value.format(this.options.viewformat) : '';
$(element).text(text);
//$(element).text(text);
Constructor.superclass.value2html.call(this, text, element);
},
html2value: function(html) {
@ -4502,7 +4544,7 @@ Editableform based on Twitter Bootstrap 3
var defaultClass = 'input-sm';
//bs3 add `form-control` class to standard inputs
var stdtypes = 'text,select,textarea,password,email,url,tel,number,range,time'.split(',');
var stdtypes = 'text,select,textarea,password,email,url,tel,number,range,time,typeaheadjs'.split(',');
if(~$.inArray(this.input.type, stdtypes)) {
this.input.$input.addClass('form-control');
if(emptyInputClass) {
@ -6085,7 +6127,7 @@ $(function(){
value2html: function(value, element) {
var text = value ? this.dpg.formatDate(value, this.parsedViewFormat, this.options.datepicker.language) : '';
Date.superclass.value2html(text, element);
Date.superclass.value2html.call(this, text, element);
},
html2value: function(html) {
@ -6407,7 +6449,7 @@ $(function(){
//formatDate works with UTCDate!
var text = value ? this.dpg.formatDate(this.toUTC(value), this.parsedViewFormat, this.options.datetimepicker.language, this.options.formatType) : '';
if(element) {
DateTime.superclass.value2html(text, element);
DateTime.superclass.value2html.call(this, text, element);
} else {
return text;
}

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

@ -0,0 +1,49 @@
.twitter-typeahead .tt-query,
.twitter-typeahead .tt-hint {
margin-bottom: 0;
}
.tt-dropdown-menu {
min-width: 160px;
margin-top: 2px;
padding: 5px 0;
background-color: #fff;
border: 1px solid #ccc;
border: 1px solid rgba(0,0,0,.2);
*border-right-width: 2px;
*border-bottom-width: 2px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
-moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
box-shadow: 0 5px 10px rgba(0,0,0,.2);
-webkit-background-clip: padding-box;
-moz-background-clip: padding;
background-clip: padding-box;
}
.tt-suggestion {
display: block;
padding: 3px 20px;
}
.tt-suggestion.tt-is-under-cursor {
color: #fff;
background-color: #0081c2;
background-image: -moz-linear-gradient(top, #0088cc, #0077b3);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0077b3));
background-image: -webkit-linear-gradient(top, #0088cc, #0077b3);
background-image: -o-linear-gradient(top, #0088cc, #0077b3);
background-image: linear-gradient(to bottom, #0088cc, #0077b3);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0077b3', GradientType=0)
}
.tt-suggestion.tt-is-under-cursor a {
color: #fff;
}
.tt-suggestion p {
margin: 0;
}

@ -0,0 +1,86 @@
/**
Typeahead.js input, based on [Twitter Typeahead](http://twitter.github.io/typeahead.js)
It is mainly replacement of typeahead in Bootstrap 3.
@class typeaheadjs
@extends text
@since 1.5.0
@final
@example
<a href="#" id="country" data-type="typeaheadjs" data-pk="1" data-url="/post" data-title="Input country"></a>
<script>
$(function(){
$('#country').editable({
value: 'ru',
typeahead: {
name: 'country',
local: [
{value: 'ru', tokens: ['Russia']},
{value: 'gb', tokens: ['Great Britain']},
{value: 'us', tokens: ['United States']}
],
template: function(item) {
return item.tokens[0] + ' (' + item.value + ')';
}
}
});
});
</script>
**/
(function ($) {
"use strict";
var Constructor = function (options) {
this.init('typeaheadjs', options, Constructor.defaults);
};
$.fn.editableutils.inherit(Constructor, $.fn.editabletypes.text);
$.extend(Constructor.prototype, {
render: function() {
this.renderClear();
this.setClass();
this.setAttr('placeholder');
this.$input.typeahead(this.options.typeahead);
// copy `input-sm | input-lg` classes to placeholder input
if($.fn.editableform.engine === 'bs3') {
if(this.$input.hasClass('input-sm')) {
this.$input.siblings('input.tt-hint').addClass('input-sm');
}
if(this.$input.hasClass('input-lg')) {
this.$input.siblings('input.tt-hint').addClass('input-lg');
}
}
}
});
Constructor.defaults = $.extend({}, $.fn.editabletypes.list.defaults, {
/**
@property tpl
@default <input type="text">
**/
tpl:'<input type="text">',
/**
Configuration of typeahead itself.
[Full list of options](https://github.com/twitter/typeahead.js#dataset).
@property typeahead
@type object
@default null
**/
typeahead: null,
/**
Whether to show `clear` button
@property clear
@type boolean
@default true
**/
clear: true
});
$.fn.editabletypes.typeaheadjs = Constructor;
}(window.jQuery));

@ -87,6 +87,17 @@ $(function(){
activate: function() {
this.$input.data("wysihtml5").editor.focus();
},
isEmpty: function($element) {
if($.trim($element.html()) === '') {
return true;
} else if($.trim($element.text()) !== '') {
return false;
} else {
//e.g. '<img>', '<br>', '<p></p>'
return !$element.height() || !$element.width();
}
}
});

@ -1,4 +1,4 @@
/*! X-editable - v1.4.7
/*! X-editable - v1.5.0
* In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
* http://github.com/vitalets/x-editable
* Copyright (c) 2013 Vitaliy Potapov; Licensed MIT */

@ -1,4 +1,4 @@
/*! X-editable - v1.4.7
/*! X-editable - v1.5.0
* In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
* http://github.com/vitalets/x-editable
* Copyright (c) 2013 Vitaliy Potapov; Licensed MIT */
@ -623,7 +623,7 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc.
$.fn.editableform.errorBlockClass = 'editable-error';
//engine
$.fn.editableform.engine = 'jqeury';
$.fn.editableform.engine = 'jquery';
}(window.jQuery));
/**
@ -1732,13 +1732,12 @@ Makes editable any HTML element on the page. Applied as jQuery method.
this.isEmpty = isEmpty;
} else {
//detect empty
if($.trim(this.$element.html()) === '') {
this.isEmpty = true;
} else if($.trim(this.$element.text()) !== '') {
this.isEmpty = false;
//for some inputs we need more smart check
//e.g. wysihtml5 may have <br>, <p></p>, <img>
if(typeof(this.input.isEmpty) === 'function') {
this.isEmpty = this.input.isEmpty(this.$element);
} else {
//e.g. '<img>'
this.isEmpty = !this.$element.height() || !this.$element.width();
this.isEmpty = $.trim(this.$element.html()) === '';
}
}
@ -2313,7 +2312,7 @@ To create your own input you can inherit from this class.
@param {DOMElement} element
**/
value2html: function(value, element) {
$(element).text($.trim(value));
$(element)[this.options.escape ? 'text' : 'html']($.trim(value));
},
/**
@ -2455,6 +2454,19 @@ To create your own input you can inherit from this class.
@default null
**/
inputclass: null,
/**
If `true` - html will be escaped in content of element via $.text() method.
If `false` - html will not be escaped, $.html() used.
When you use own `display` function, this option has no influence.
@property escape
@type boolean
@since 1.5.0
@default true
**/
escape: true,
//scope for external methods (e.g. source defined as function)
//for internal use only
scope: null,
@ -2586,8 +2598,8 @@ List - abstract class for inputs that have source option loaded from js array or
}
}
//loading sourceData from server
$.ajax({
//ajaxOptions for source. Can be overwritten bt options.sourceOptions
var ajaxOptions = $.extend({
url: source,
type: 'get',
cache: false,
@ -2622,7 +2634,11 @@ List - abstract class for inputs that have source option loaded from js array or
$.each(cache.err_callbacks, function () { this.call(); });
}
}, this)
});
}, this.options.sourceOptions);
//loading sourceData from server
$.ajax(ajaxOptions);
} else { //options as json/array
this.sourceData = this.makeArray(source);
@ -2782,7 +2798,17 @@ List - abstract class for inputs that have source option loaded from js array or
@default true
@since 1.2.0
**/
sourceCache: true
sourceCache: true,
/**
Additional ajax options to be used in $.ajax() when loading list from server.
Useful to send extra parameters (`data` key) or change request method (`type` key).
@property sourceOptions
@type object|function
@default null
@since 1.5.0
**/
sourceOptions: null
});
$.fn.editabletypes.list = List;
@ -3110,7 +3136,8 @@ $(function(){
text = items[0].text;
}
$(element).text(text);
//$(element).text(text);
$.fn.editabletypes.abstractinput.prototype.value2html.call(this, text, element);
},
autosubmit: function() {
@ -3234,10 +3261,14 @@ $(function(){
//collect text of checked boxes
value2htmlFinal: function(value, element) {
var html = [],
checked = $.fn.editableutils.itemsByValue(value, this.sourceData);
checked = $.fn.editableutils.itemsByValue(value, this.sourceData),
escape = this.options.escape;
if(checked.length) {
$.each(checked, function(i, v) { html.push($.fn.editableutils.escape(v.text)); });
$.each(checked, function(i, v) {
var text = escape ? $.fn.editableutils.escape(v.text) : v.text;
html.push(text);
});
$(element).html(html.join('<br>'));
} else {
$(element).empty();
@ -3507,7 +3538,7 @@ Time
/**
Select2 input. Based on amazing work of Igor Vaynberg https://github.com/ivaynberg/select2.
Please see [original select2 docs](http://ivaynberg.github.com/select2) for detailed description and options.
Compatible **select2 version is 3.4.1**!
You should manually download and include select2 distributive:
<link href="select2/select2.css" rel="stylesheet" type="text/css"></link>
@ -3648,9 +3679,11 @@ $(function(){
$.extend(Constructor.prototype, {
render: function() {
this.setClass();
//apply select2
this.$input.select2(this.options.select2);
//can not apply select2 here as it calls initSelection
//over input that does not have correct value yet.
//apply select2 only in value2input
//this.$input.select2(this.options.select2);
//when data is loaded via ajax, we need to know when it's done to populate listData
if(this.isRemote) {
@ -3678,7 +3711,8 @@ $(function(){
} else if(this.sourceData) {
data = $.fn.editableutils.itemsByValue(value, this.sourceData, this.idFunc);
} else {
//can not get list of possible values (e.g. autotext for select2 with ajax source)
//can not get list of possible values
//(e.g. autotext for select2 with ajax source)
}
//data may be array (when multiple values allowed)
@ -3694,7 +3728,8 @@ $(function(){
text = $.isArray(text) ? text.join(this.options.viewseparator) : text;
$(element).text(text);
//$(element).text(text);
Constructor.superclass.value2html.call(this, text, element);
},
html2value: function(html) {
@ -3713,8 +3748,14 @@ $(function(){
}
*/
//for remote source just set value, text is updated by initSelection
this.$input.val(value).trigger('change', true); //second argument needed to separate initial change from user's click (for autosubmit)
//for remote source just set value, text is updated by initSelection
if(!this.$input.data('select2')) {
this.$input.val(value);
this.$input.select2(this.options.select2);
} else {
//second argument needed to separate initial change from user's click (for autosubmit)
this.$input.val(value).trigger('change', true);
}
//if remote source AND no user's initSelection provided --> try to use element's text
if(this.isRemote && !this.isMultiple && !this.options.select2.initSelection) {
@ -3722,7 +3763,7 @@ $(function(){
customText = this.options.select2.formatSelection;
if(!customId && !customText) {
var data = {id: value, text: $(this.options.scope).text()};
this.$input.select2('data', data);
this.$input.select2('data', data);
}
}
},
@ -3811,7 +3852,7 @@ $(function(){
E.g. `[{id: 1, text: "text1"}, {id: 2, text: "text2"}, ...]`.
@property source
@type array
@type array|string|function
@default null
**/
source: null,
@ -4372,7 +4413,8 @@ $(function(){
value2html: function(value, element) {
var text = value ? value.format(this.options.viewformat) : '';
$(element).text(text);
//$(element).text(text);
Constructor.superclass.value2html.call(this, text, element);
},
html2value: function(html) {
@ -4755,7 +4797,7 @@ $(function(){
value2html: function(value, element) {
var text = $.datepicker.formatDate(this.options.viewformat, value);
DateUI.superclass.value2html(text, element);
DateUI.superclass.value2html.call(this, text, element);
},
html2value: function(html) {

File diff suppressed because one or more lines are too long

@ -1,4 +1,4 @@
/*! X-editable - v1.4.7
/*! X-editable - v1.5.0
* In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
* http://github.com/vitalets/x-editable
* Copyright (c) 2013 Vitaliy Potapov; Licensed MIT */

@ -1,4 +1,4 @@
/*! X-editable - v1.4.7
/*! X-editable - v1.5.0
* In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
* http://github.com/vitalets/x-editable
* Copyright (c) 2013 Vitaliy Potapov; Licensed MIT */
@ -623,7 +623,7 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc.
$.fn.editableform.errorBlockClass = 'editable-error';
//engine
$.fn.editableform.engine = 'jqeury';
$.fn.editableform.engine = 'jquery';
}(window.jQuery));
/**
@ -1732,13 +1732,12 @@ Makes editable any HTML element on the page. Applied as jQuery method.
this.isEmpty = isEmpty;
} else {
//detect empty
if($.trim(this.$element.html()) === '') {
this.isEmpty = true;
} else if($.trim(this.$element.text()) !== '') {
this.isEmpty = false;
//for some inputs we need more smart check
//e.g. wysihtml5 may have <br>, <p></p>, <img>
if(typeof(this.input.isEmpty) === 'function') {
this.isEmpty = this.input.isEmpty(this.$element);
} else {
//e.g. '<img>'
this.isEmpty = !this.$element.height() || !this.$element.width();
this.isEmpty = $.trim(this.$element.html()) === '';
}
}
@ -2313,7 +2312,7 @@ To create your own input you can inherit from this class.
@param {DOMElement} element
**/
value2html: function(value, element) {
$(element).text($.trim(value));
$(element)[this.options.escape ? 'text' : 'html']($.trim(value));
},
/**
@ -2455,6 +2454,19 @@ To create your own input you can inherit from this class.
@default null
**/
inputclass: null,
/**
If `true` - html will be escaped in content of element via $.text() method.
If `false` - html will not be escaped, $.html() used.
When you use own `display` function, this option has no influence.
@property escape
@type boolean
@since 1.5.0
@default true
**/
escape: true,
//scope for external methods (e.g. source defined as function)
//for internal use only
scope: null,
@ -2586,8 +2598,8 @@ List - abstract class for inputs that have source option loaded from js array or
}
}
//loading sourceData from server
$.ajax({
//ajaxOptions for source. Can be overwritten bt options.sourceOptions
var ajaxOptions = $.extend({
url: source,
type: 'get',
cache: false,
@ -2622,7 +2634,11 @@ List - abstract class for inputs that have source option loaded from js array or
$.each(cache.err_callbacks, function () { this.call(); });
}
}, this)
});
}, this.options.sourceOptions);
//loading sourceData from server
$.ajax(ajaxOptions);
} else { //options as json/array
this.sourceData = this.makeArray(source);
@ -2782,7 +2798,17 @@ List - abstract class for inputs that have source option loaded from js array or
@default true
@since 1.2.0
**/
sourceCache: true
sourceCache: true,
/**
Additional ajax options to be used in $.ajax() when loading list from server.
Useful to send extra parameters (`data` key) or change request method (`type` key).
@property sourceOptions
@type object|function
@default null
@since 1.5.0
**/
sourceOptions: null
});
$.fn.editabletypes.list = List;
@ -3110,7 +3136,8 @@ $(function(){
text = items[0].text;
}
$(element).text(text);
//$(element).text(text);
$.fn.editabletypes.abstractinput.prototype.value2html.call(this, text, element);
},
autosubmit: function() {
@ -3234,10 +3261,14 @@ $(function(){
//collect text of checked boxes
value2htmlFinal: function(value, element) {
var html = [],
checked = $.fn.editableutils.itemsByValue(value, this.sourceData);
checked = $.fn.editableutils.itemsByValue(value, this.sourceData),
escape = this.options.escape;
if(checked.length) {
$.each(checked, function(i, v) { html.push($.fn.editableutils.escape(v.text)); });
$.each(checked, function(i, v) {
var text = escape ? $.fn.editableutils.escape(v.text) : v.text;
html.push(text);
});
$(element).html(html.join('<br>'));
} else {
$(element).empty();
@ -3507,7 +3538,7 @@ Time
/**
Select2 input. Based on amazing work of Igor Vaynberg https://github.com/ivaynberg/select2.
Please see [original select2 docs](http://ivaynberg.github.com/select2) for detailed description and options.
Compatible **select2 version is 3.4.1**!
You should manually download and include select2 distributive:
<link href="select2/select2.css" rel="stylesheet" type="text/css"></link>
@ -3648,9 +3679,11 @@ $(function(){
$.extend(Constructor.prototype, {
render: function() {
this.setClass();
//apply select2
this.$input.select2(this.options.select2);
//can not apply select2 here as it calls initSelection
//over input that does not have correct value yet.
//apply select2 only in value2input
//this.$input.select2(this.options.select2);
//when data is loaded via ajax, we need to know when it's done to populate listData
if(this.isRemote) {
@ -3678,7 +3711,8 @@ $(function(){
} else if(this.sourceData) {
data = $.fn.editableutils.itemsByValue(value, this.sourceData, this.idFunc);
} else {
//can not get list of possible values (e.g. autotext for select2 with ajax source)
//can not get list of possible values
//(e.g. autotext for select2 with ajax source)
}
//data may be array (when multiple values allowed)
@ -3694,7 +3728,8 @@ $(function(){
text = $.isArray(text) ? text.join(this.options.viewseparator) : text;
$(element).text(text);
//$(element).text(text);
Constructor.superclass.value2html.call(this, text, element);
},
html2value: function(html) {
@ -3713,8 +3748,14 @@ $(function(){
}
*/
//for remote source just set value, text is updated by initSelection
this.$input.val(value).trigger('change', true); //second argument needed to separate initial change from user's click (for autosubmit)
//for remote source just set value, text is updated by initSelection
if(!this.$input.data('select2')) {
this.$input.val(value);
this.$input.select2(this.options.select2);
} else {
//second argument needed to separate initial change from user's click (for autosubmit)
this.$input.val(value).trigger('change', true);
}
//if remote source AND no user's initSelection provided --> try to use element's text
if(this.isRemote && !this.isMultiple && !this.options.select2.initSelection) {
@ -3722,7 +3763,7 @@ $(function(){
customText = this.options.select2.formatSelection;
if(!customId && !customText) {
var data = {id: value, text: $(this.options.scope).text()};
this.$input.select2('data', data);
this.$input.select2('data', data);
}
}
},
@ -3811,7 +3852,7 @@ $(function(){
E.g. `[{id: 1, text: "text1"}, {id: 2, text: "text2"}, ...]`.
@property source
@type array
@type array|string|function
@default null
**/
source: null,
@ -4372,7 +4413,8 @@ $(function(){
value2html: function(value, element) {
var text = value ? value.format(this.options.viewformat) : '';
$(element).text(text);
//$(element).text(text);
Constructor.superclass.value2html.call(this, text, element);
},
html2value: function(html) {
@ -4508,7 +4550,7 @@ Editableform based on jQuery UI
$.fn.editableform.errorGroupClass = null;
$.fn.editableform.errorBlockClass = 'ui-state-error';
//engine
$.fn.editableform.engine = 'jqeury-ui';
$.fn.editableform.engine = 'jquery-ui';
}(window.jQuery));
/**
@ -4702,7 +4744,7 @@ $(function(){
value2html: function(value, element) {
var text = $.datepicker.formatDate(this.options.viewformat, value);
DateUI.superclass.value2html(text, element);
DateUI.superclass.value2html.call(this, text, element);
},
html2value: function(html) {

File diff suppressed because one or more lines are too long