jQuery html() and &

Question

I'm doing a search within list of people. And I want it to show results on the fly and so it does. But there is one link that I need and it should look like this:

chatid=18&userid=45&create=new

but after the results are displayed through this:

$.get('/ajax.php', {sec: 'search_users', ajax: 1, search_for: $(this).val()}, function(data)
{
 $(".rBoxContentStaff").html(data);
});

I get this result:

chatid=18&userid=45&create=new

And the link doesn't work. This seems to happen in html() and also append().

I found no solution for this so I had to change the triggering of the link.

Answer 1

did you alert data to check if .html() replaces the symbols or maybe the ajax request?

Answer 2

Hi,

html special chars when requested by ajax, don't get interpreted by the browser .. that's why the links came out that way. One thing you can do is a sstring replace in javascript:

data = str.replace(/&/, "&");

Answer 3

You said you are trying to set the link path correct?
If so try this

$(".rBoxContentStaff").attr("href", data);

the .html() is changing the & to an html & (&) but using .attr("href") sets the link path and it works with &s as well

Answer 4

Instead of doing this:

$(".rBoxContentStaff").html(data); });

Try this:

$(".rBoxContentStaff").append(data); });

text() escapes html characters ... I can't find anything about html() escaping characters (and indeed, its documentation seems to indicate otherwise.
However, after testing with alert at jmein's suggestion, it does encode special characters. Append() does not do so.

Answer 5

You should try using the $.ajax() function instead of $.get().

With $.ajax() you can specify your datatype yourself (and use other options).

Try something like this:

$.ajax({
type: "GET",
url: "/ajax.php",
data: "sec=search_users&ajax=1&search_for="+$(this).val(),
cache: false,
dataType: "html",
success: function(html){
 $(".rBoxContentStaff").html(html);
} });