diff --git a/CHANGELOG.txt b/CHANGELOG.txt
index a3e67ea..42c3e8e 100644
--- a/CHANGELOG.txt
+++ b/CHANGELOG.txt
@@ -4,6 +4,7 @@ X-editable changelog
Version 1.3.1 wip
----------------------------
+[enh] new util method `$.fn.editableutils.itemsByValue` to easily get selected items for sourced-inputs (vitalets)
[enh] convert newlines to <br> in error message for more pretty display (vitalets)
[enh #57] remove css height for textarea (vitalets)
[enh] if new value for select is 'null' source should not load (vitalets)
diff --git a/src/editable-form/editable-form-utils.js b/src/editable-form/editable-form-utils.js
index aa22f64..ab760f4 100644
--- a/src/editable-form/editable-form-utils.js
+++ b/src/editable-form/editable-form-utils.js
@@ -124,6 +124,28 @@
**/
escape: function(str) {
return $('<div>').text(str).html();
+ },
+
+ /*
+ returns array items from sourceData having value property equal or inArray of 'value'
+ */
+ itemsByValue: function(value, sourceData) {
+ if(!sourceData || value === null) {
+ return [];
+ }
+
+ if(!$.isArray(value)) {
+ value = [].push(value);
+ }
+
+ /*jslint eqeq: true*/
+ var result = $.grep(sourceData, function(o){
+ return $.grep(value, function(v){ return v == o.value; }).length;
+ });
+ /*jslint eqeq: false*/
+
+ return result;
}
+
};
}(window.jQuery));
\ No newline at end of file
diff --git a/src/element/editable-element.js b/src/element/editable-element.js
index dcd564f..6276a99 100644
--- a/src/element/editable-element.js
+++ b/src/element/editable-element.js
@@ -547,10 +547,11 @@ Makes editable any HTML element on the page. Applied as jQuery method.
value: null,
/**
Callback to perform custom displaying of value in element's text.
- If <code>null</code>, default input's value2html() will be called.
- If <code>false</code>, no displaying methods will be called, element's text will never change.
+ If `null`, default input's value2html() will be called.
+ If `false`, no displaying methods will be called, element's text will never change.
Runs under element's scope.
- Second parameter __sourceData__ is passed for inputs with source (select, checklist).
+ Second parameter __sourceData__ is passed for inputs with source (select, checklist). To get currently selected items
+ use `$.fn.editableutils.itemsByValue(value, sourceData)` function.
@property display
@type function|boolean
@@ -558,8 +559,16 @@ Makes editable any HTML element on the page. Applied as jQuery method.
@since 1.2.0
@example
display: function(value, sourceData) {
- var escapedValue = $('<div>').text(value).html();
- $(this).html('<b>'+escapedValue+'</b>');
+ //display checklist as comma-separated values
+ var html = [],
+ checked = $.fn.editableutils.itemsByValue(value, sourceData);
+
+ if(checked.length) {
+ $.each(checked, function(i, v) { html.push($.fn.editableutils.escape(v.text)); });
+ $(element).html(html.join(', '));
+ } else {
+ $(element).empty();
+ }
}
**/
display: null
diff --git a/src/inputs/checklist.js b/src/inputs/checklist.js
index ea61ac3..a78ea53 100644
--- a/src/inputs/checklist.js
+++ b/src/inputs/checklist.js
@@ -94,11 +94,8 @@ $(function(){
//collect text of checked boxes
value2htmlFinal: function(value, element) {
var html = [],
- /*jslint eqeq: true*/
- checked = $.grep(this.sourceData, function(o){
- return $.grep(value, function(v){ return v == o.value; }).length;
- });
- /*jslint eqeq: false*/
+ checked = $.fn.editableutils.itemsByValue(value, this.sourceData);
+
if(checked.length) {
$.each(checked, function(i, v) { html.push($.fn.editableutils.escape(v.text)); });
$(element).html(html.join('<br>'));
diff --git a/src/inputs/list.js b/src/inputs/list.js
index 2cf8414..34d704d 100644
--- a/src/inputs/list.js
+++ b/src/inputs/list.js
@@ -236,20 +236,7 @@ List - abstract class for inputs that have source option loaded from js array or
});
}
return result;
- },
-
- //search for item by particular value
- itemByVal: function(val) {
- if($.isArray(this.sourceData)) {
- for(var i=0; i<this.sourceData.length; i++){
- /*jshint eqeqeq: false*/
- if(this.sourceData[i].value == val) {
- /*jshint eqeqeq: true*/
- return this.sourceData[i];
- }
- }
- }
- }
+ }
});
diff --git a/src/inputs/select.js b/src/inputs/select.js
index 60afb6b..b4d3048 100644
--- a/src/inputs/select.js
+++ b/src/inputs/select.js
@@ -47,10 +47,13 @@ $(function(){
},
value2htmlFinal: function(value, element) {
- var text = '', item = this.itemByVal(value);
- if(item) {
- text = item.text;
+ var text = '',
+ items = $.fn.editableutils.itemsByValue(value, this.sourceData);
+
+ if(items.length) {
+ text = items[0].text;
}
+
Select.superclass.constructor.superclass.value2html(text, element);
},
diff --git a/test/unit/select.js b/test/unit/select.js
index 138fdf9..c011aff 100644
--- a/test/unit/select.js
+++ b/test/unit/select.js
@@ -609,7 +609,7 @@ $(function () {
});
var e = $('<a href="#" data-type="select" data-pk="1" data-name="name1" data-value="1" data-url="post.php" data-source="groups-null.php">11</a>').appendTo(fx).editable(),
- d = e.data('editable');
+ d = e.data('editable');
e.editable('setValue', null);