views:

769

answers:

3

I'm new to jquery and to some extent javascript programming. I've successfully started to use jquery for my ajax calls however I'm stumped and I'm sure this is a newbie question but here goes.

I'm trying to return in an ajax call a complete html structure, to the point a table structure. However what keeps happening is that jquery either strips the html tags away and only inserts the deepest level of "text" or the special characters like <,>, etc get replaced with the escaped ones

I need to know how to turn off this processing of the received characters. Using firebug I see the responses going out of my webserver correctly but the page received by the user and thus processed by jquery are incorrect. A quick example will so what I mean.

I'm sending something like this

<results><table id="test"><tr>test</tr></table></results>

what shows up on my page if I do a page source view is this.

&lt;results&gt;&lt;table....

so you can see the special characters are getting converted and I don't know how to stop it.

The idea is for the <results></results> to be the xml tag and the text of that tag to be what gets placed into an existing <div> on my page.

Here is the javascipt that I'm using to pull down the response and inserts:

$.post(url, params, function(data) 
{ 
  $('#queryresultsblock').text(data)
}, "html");

I've tried various options other than "html" like, "xml", "text" etc. They all do various things, the "html" gets me the closest so far.

thank you for any help.

tim

+1  A: 

You can't put unescaped HTML inside of XML. There are two options I see as good ways to go.

One way is to send escaped HTML in the XML, then have some JavaScript on the client side unescape that HTML. So you would send

<results>&lt;results&gt;&lt;table....

And the javascript would convert the &lt; to < and such.

The other option, and what I would do, is to use JSON instead of XML.

{'results': "<table id="test"><tr>test</tr></table>" }

The JavaScript should be able to extract that HTML structure as a string and insert it directly into your page without any sort of escaping or unescaping.

Apreche
You actually CAN place unescaped tags in XML with CDATA:http://www.w3schools.com/XML/xml_cdata.asp
Jason Watts
Thank you, here is what is weird thou. If I replace the assign statement in my javascript return function with just an alert(data) the correct text is there <results>... So it must be that jquery in processing the input is doing this conversion, is there a way to force or use a process in jquery to just accept this text.
Tim Ashman
A: 

The other thing you could do is create an external .html file with just your HTML code snippet in it. So create include.html with

<results><table id="test"><tr>test</tr></table></results>

As the contents, then use a jquery .load function to get it onto the page. See it in action here.

mrr0ng
+2  A: 

The simplest way is just to return your raw HTML and use the html method of jQuery.

Your result:

<table id="test"><tr>test</tr></table>

Your Javascript call:

$.post(url, params, function(data){ $('#queryresultsblock').html(data) })


Another solution with less control — you can only do a GET request — but simpler is to use load:

$("#queryresultsblock").load(url);

If you must return your result in a results XML tag, you can try adding a jQuery selector to your load call:

$("#queryresultsblock").load(url + " #test");
Vincent Robert
Thank you. This did it. I knew it had to be my lack of jquery knowledge.
Tim Ashman