jQuery AJAX: ¿Cómo pasar etiquetas HTML grandes como parámetros?

Question

¿Cómo puedo pasar datos de una etiqueta HTML grande a mi PHP usando jQuery AJAX? Cuando recibo el resultado, es incorrecto. código

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 valor real:

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

resultado de volver de mi 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

Ver si cambiar parametros de una cadena a un objeto ayuda:

var params = { tree_contents: treeInnerHTML }; 

Ver http://jsfiddle.net/7bF2Y/

Answer 2

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

TreeInnerHTML está siendo cortado en la primera marca & (ya que los datos de POST utiliza var1=val&var2=val2&... formato), la El resto del HTML resultante es su navegador que cierra automáticamente las etiquetas no cerradas.

Answer 3

Está pasando el valor sin codificación URL, por lo que probablemente no se está analizando correctamente en el servidor. Como Salman Un dijo, usted debe conseguir jQuery para hacerse cargo de esto para usted pasando un diccionario en su lugar:

var params = { tree_contents: treeInnerHTML };