jeditable encoding & turns into & when editing

Question

I'm using jeditable and having some encoding issues. If I enter &, save, and then try to edit it shows up as &.

Easily reproducible here: http://www.appelsiini.net/projects/jeditable/default.html

Edit the Normal textarea and enter &&&, save and then edit again and you'll see it. How can I fix this?

Rearmost

Answer 1

A way better solution.... even for compressed js file.

Search for line :

self.revert     = $(self).html();

replace with

self.revert     = $(self).text();

Solution no1 would not work if you would like to have "&" in your editable field Sollution no2 is version dependent

Plough

It works. Thank you. Would be nice to see jEditable source file updated. It's still the same code from 2009 – Tenno

Fixes that particular issue, but creates others. Try typing in some HTML into your jEditable. Something like an anchor tag... – Mcquade

Answer 2

solution:

input_content = $('<textarea/>').html(self.revert).val();

This converts the input to a html_safe type format. This goes in around line 247 to replace:

input_content = self.revert; 

Rearmost

thanx! this helped solve the problem for every escaped character. – Lubin

Answer 3

I encountered the same issue, here is what I edited in the jquery.jeditable.js (v 1.7.1) file :

replace l.176 :

self.editing    = true;
self.revert     = $(self).html(); 
$(self).html('');

by

self.editing    = true;
self.revert     = $(self).html().replace(/&/g,"&");
$(self).html('');

This is a simple regexp replacing & by & and it did the job !

Talebearer

Answer 4

There is a pull request for this problem on the github repo.

The quick fix is as Alex said. If you don't know what to change, look at the file on the pull request.

The better fix is to pester the repo owner, since this pull request is two years old.

Peppi

Answer 5

This can be done without changing the jeditable source code by using the data callback in the options:

  // Called after onedit, the 'data' callback allows 
  // manipulation of data to be displayed in edit forms
  'data': function(value, settings) {
    return html_decode(value);
  },

where html_decode() is defined, for example like this:

  html_decode: function (str) {
        return String(str)
            .replace(/>/g, '>')
            .replace(/&lt;/g, '<')
            .replace(/&#39;/g, "'")
            .replace(/&quot;/g, '"')
            .replace(/&amp;/g, '&')
            .replace(/&nbsp;/g, ' ');
  },

Lolland