convert newlines to br in error msg

CHANGELOG.txt

@@ -4,6 +4,7 @@ X-editable changelog
 
 Version 1.3.1 wip
 ---------------------------- 
+[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) 
 [enh #53] 'name' no more appended to source defined as url (vitalets) 

src/editable-form/editable-form.js

@@ -154,14 +154,23 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc.
 
         error: function(msg) {
             var $group = this.$form.find('.control-group'),
-            $block = this.$form.find('.editable-error-block');
+                $block = this.$form.find('.editable-error-block'),
+                lines;
 
             if(msg === false) {
                 $group.removeClass($.fn.editableform.errorGroupClass);
                 $block.removeClass($.fn.editableform.errorBlockClass).empty().hide(); 
             } else {
+                //convert newline to <br> for more pretty error display
+                if(msg) {
+                    lines = msg.split("\n");
+                    for (var i = 0; i < lines.length; i++) {
+                        lines[i] = $('<div>').text(lines[i]).html();
+                    }
+                    msg = lines.join('<br>');
+                }
                 $group.addClass($.fn.editableform.errorGroupClass);
-                $block.addClass($.fn.editableform.errorBlockClass).text(msg).show();
+                $block.addClass($.fn.editableform.errorBlockClass).html(msg).show();
             }
         },
 

test/unit/text.js

@@ -86,7 +86,7 @@ $(function () {
       });     
       
      asyncTest("should show error on server validation", function () {
-        var msg = 'required',
+        var msg = "required\nfield",
            e = $('<a href="#" data-name="text1">abc</a>').appendTo(fx).editable({
               validate: function(value) { 
                   ok(this === e[0], 'scope is ok');
@@ -104,7 +104,8 @@ $(function () {
         setTimeout(function() {
            ok(p.is(':visible'), 'popover still shown');  
            ok(p.find('.editable-error-block').length, 'class "editable-error-block" exists');
-           equal(p.find('.editable-error-block').text(), 'required', 'error msg shown');   
+           equal(p.find('.editable-error-block').text(), msg.replace('\n', ''), 'error msg shown');   
+           equal(p.find('.editable-error-block').html(), msg.replace('\n', '<br>'), 'newline replaced with br');   
            p.find('button[type=button]').click(); 
            ok(!p.is(':visible'), 'popover was removed');
            e.remove();