jQuery send HTML data through POST

103,870

Solution 1

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);

Solution 2

If you want to send an arbitrary amount of data to your server, POST is the only reliable method to do that. GET would also be possible but clients and servers allow just a limited URL length (something like 2048 characters).

Share:
103,870
Robocop
Author by

Robocop

Updated on July 24, 2022

Comments

  • Robocop
    Robocop almost 2 years

    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.