jQuery send HTML data through POST

ajax, encoding, jquery

Solution

As far as you're concerned once you've "pulled out" the contents with something like .html() it's just a string. You can test that with

<html> 
  <head>
    <title>runthis</title>
    <script type="text/javascript" language="javascript" src="jquery-1.3.2.js"></script>
    <script type="text/javascript">
        $(document).ready( function() {
            var x = $("#foo").html();
            alert( typeof(x) );
        });
    </script>
    </head>
    <body>
        <div id="foo"><table><tr><td>x</td></tr></table><span>xyz</span></div>
    </body>
</html>

The alert text is string. As long as you don't pass it to a parser there's no magic about it, it's a string like any other string. There's nothing that hinders you from using .post() to send this string back to the server.

edit: Don't pass a string as the parameter data to .post() but an object, like

var data = {
  id: currid,
  html: div_html
};
$.post("http://...", data, ...);

jquery will handle the encoding of the parameters. If you (for whatever reason) want to keep your string you have to encode the values with something like escape().

var data = 'id='+ escape(currid) +'&html='+ escape(div_html);

Problem

I am using jQuery to make a POST to a PHP file with the HTML content of a div. The HTML content contain tables, inputs, smaller divs and I would like to grab the content of the main DIV and send it to the database. The only option I could think of is the POST method but I don't know if I can send plain HTML with it. Are there any other options for sending HTML content from a div to a PHP file to be inserted into MySQL ? Thanks. EDIT: I am now able to send full HTML data with jQuery's POST. However, my HTML characters from that DIV gets transformed into special characters. Example: ">" would become "&gt;" and when that happens, my POST data is limited to where the first special character appears because I do my ajax POST like this: ``` var data = 'id='+ currid +'&html='+ div_html; $.ajax({ type: "POST", url: "file.php", data: data, ....................... ....................... ``` Using this code is not ok because div_html contains other "&" characters so it would be considered as another POST parameter to be sent. Any workarounds ? Thanks again.

Original source