JQuery AJAX: Как передать большие теги HTML в качестве параметров?

Question

Как я могу передать большие данные тега HTML в мой PHP, используя jQuery AJAX? Когда я получаю результат, это неправильно.

JQuery AJAX код :

$('#saveButton').click(function() {
        // do AJAX and store tree structure to a PHP array 
        //(to be saved later in database)
        var treeInnerHTML = $("#demo_1").html();
        alert(treeInnerHTML);
        var ajax_url = 'ajax_process.php';
        var params = 'tree_contents=' + treeInnerHTML;
        $.ajax({
            type: 'POST',
            url: ajax_url,
            data: params,
            success: function(data) {
                $("#show_tree").html(data);

            },
            error: function(req, status, error) { }
        });
});

treeInnerHTML фактическое значение :

<ul class="ltr">
   <li id="phtml_1" class="open">
       <a href="#"><ins>&nbsp;</ins>Root node 1</a>
       <ul>
           <li class="leaf" id="phtml_2">
             <a href="#"><ins>&nbsp;</ins>Child node 1</a>
           </li>
           <li class="last leaf" id="phtml_3">
             <a href="#"><ins>&nbsp;</ins>Child node 2</a>
           </li>
       </ul>
   </li>
   <li id="phtml_5" class="file last leaf">
       <a href="#"><ins>&nbsp;</ins>Root node 2</a>
   </li>
</ul>

Возвращенный результат из моего show_tree div :

<ul class="\&quot;ltr\&quot;">
   <li id="\&quot;phtml_1\&quot;" class="\&quot;open\&quot;">
       <a href="%5C%22#%5C%22"><ins></ins></a>
   </li>
</ul>

Answer 1

Проверьте, помогает ли изменение параметров строки или объекта:

var params = { tree_contents: treeInnerHTML };

См. http://jsfiddle.net/7bF2Y/

Answer 2

var params = 'tree_contents=' + encodeURIComponent(treeInnerHTML);

TreeInnerHTML обрезается при первой отметке & (поскольку данные POST используют формат var1=val&var2=val2&...), остальная часть полученного HTML-кода - это ваш браузер, автоматически закрывающий незакрытые теги.

Answer 3

Вы передаете значение без URL-кодирования, поэтому оно, вероятно, не анализируется правильно на сервере. Как сказал Salman A , вы должны заставить jQuery позаботиться об этом, передав вместо этого словарь:

var params = { tree_contents: treeInnerHTML };