allow html as editable content, fix #78, fix #191, fix #82

CHANGELOG.txt

@@ -3,6 +3,7 @@ X-editable changelog
 
 Version 1.4.5 wip
 ----------------------------
+[enh #78] allow html in editable content (vitalets)
 [enh] update container position when datetimepicker viewMode changes (vitalets)
 [enh #255] remove xxxView options from first level config of datetimepicker (vitalets)
 [enh] if `display` defined as function call it on init (vitalets)

src/element/editable-element.js

@@ -265,7 +265,24 @@ Makes editable any HTML element on the page. Applied as jQuery method.
                 return;
             }
 
-            this.isEmpty = isEmpty !== undefined ? isEmpty : $.trim(this.$element.text()) === '';           
+            /* 
+            isEmpty may be set directly as param of method.
+            It is required when we enable/disable field and can't rely on content 
+            as node content is text: "Empty" that is not empty %)
+            */
+            if(isEmpty !== undefined) { 
+                this.isEmpty = isEmpty;
+			} else {
+				//detect empty
+				if($.trim(this.$element.html()) === '') { 
+					this.isEmpty = true;
+				} else if($.trim(this.$element.text()) !== '') {
+					this.isEmpty = false;
+				} else {
+					//e.g. '<img>'
+					this.isEmpty = !this.$element.height() || !this.$element.width();
+				}
+			}           
             
             //emptytext shown only for enabled
             if(!this.options.disabled) {

test/unit/text.js

@@ -434,7 +434,28 @@ $(function () {
            start();  
         }, timeout);             
         
-      });     
+    });
+    
+    test("'display' returning html only (img)", function () {
+        var c = 0,
+            html = '<img src="../src/img/clear.png">',
+            html_br = '<br>',
+            e = $('<a href="#" data-pk="1" data-type="text" data-name="text1">0</a>').appendTo('#qunit-fixture').editable({
+              display: function(value, response) {
+          	      $(this).html(c == 0 ? html : html_br);
+              } 
+            });  
+
+        equal(e.html(), html, 'html ok');
+        
+        c = 1;
+ 		e.click()
+        var p = tip(e);
+        p.find('input').val(1);         	
+        p.find('form').submit();
+        
+		equal(e.html(), $.fn.editable.defaults.emptytext, 'html br --> emptytext ok');
+    });         
 
    test("password", function () {
           var v = '123', v1 = '456';