0

This is a bit of a specific request unfortunately.

I have a CMS that allows a user to input text into a tinymce editor for various posts they have made. The editor is loaded via ajax to allow multiple posts to be edited from one page. I want to be able to check if there were edits made to the main text if cancel is clicked.

Currently I get the value of the text from the database during the ajax call, json_encode it, then store it in a javascript variable during the callback, to be checked against later. When cancel is clicked the current value of the hidden textarea (used by tinymce to store the data for submission) is grabbed using jquery.val() and checked against the stored value from the previous ajax call like this:

if(stored_value!=textarea.val())
{
    return true
}

It currently always returns true, even if no changes have been made.

The issue seems to be that the textarea.val() uses html entities, whereas the ajax jsoned version doesn't.

the response from ajax in firebug looks like this:

<p>some text<\/p>\r\n<p>some more text<\/p>

the textarea source code looks like this:

&lt;p&gt;some text&lt;/p&gt;
&lt;p&gt;some more text&lt;/p&gt;

these are obviously different, but how can I get them to be treated as the same when evaluated?

Is there a function that compares the final output of a string or a way to convert one string to the other using javascript?

I tried using html entities in the ajax page, but this returned the string with html entities intact when alerted, I assume because json_encoding it turned them into characters.

Any help would be greatly appreciated.

andyface
  • 937
  • 1
  • 9
  • 25
  • You should use firebug to debug you JS. console.log(stored_value, ' - ', textarea.val()) I wonder if your using jquery correctly since you should be using $('textarea#mytextarea').val(); – Michael D. Irizarry Mar 31 '10 at 12:06
  • Sorry that was me abbreviating things to save time typing, I do use something like $(textarea#mytextarea').val(), but was simplifying that to textarea.val() to show I was getting the value of the textarea. – andyface Apr 06 '10 at 09:24

3 Answers3

0

With prototype you just need to escape the Ajax response before compare it:

ajaxResponse.escapeHTML();

With JQuery I think is a little more different. Try this:

Escaping strings with Jquery

Community
  • 1
  • 1
Rui Carneiro
  • 5,595
  • 5
  • 33
  • 39
  • thanks for the response, I'm not keen to use the prototype library as well as jquery, and the jquery solution doesn't seem work with .val() only .text() unfortunately. – andyface Mar 31 '10 at 15:27
0

I really don't believe this is the best way with jQuery, but it works.

var test = "&lt;p&gt;some text&lt;/p&gt;";
var dummy = $("<p/>");
test = dummy.text(dummy.html(test));

alert(test);
jAndy
  • 231,737
  • 57
  • 305
  • 359
  • Internally, Prototype does something like that to do HTML escaping, so I don't think it's that bad. – Pointy Mar 31 '10 at 12:32
0

Why dont you try a different approach?

Try to compare textarea.defaultValue and textarea.value before submit your form. If those values are equal the user did not changed anything.

Rui Carneiro
  • 5,595
  • 5
  • 33
  • 39
  • I may give this a go, as it seems like the most logical way of doing things, I remember reading about the defaultValue attribute (if it is an attribute) but haven't used it before. – andyface Apr 06 '10 at 09:25