Estoy tratando de escribir el contenido de un div en un nuevo archivo html. El contenido de div está siendo generado por ajax, por lo que cuando intento publicar el contenido en un nuevo archivo, todo lo que se escribe en el archivo es el html sin formato. ¿Hay alguna forma de escribir el contenido div del contenido 'ajaxed in'?

Este es mi código ajax:

$("#getSource").on('click', function(){

  headerURL = $(".header-code").attr('data-url');
  $.ajax({
    url: headerURL,
    data: "function=showCode",
    success: function(data){
      $('code #mainCode').append(data);
    }
  });

  var bufferId =$("#mainCode").html();
  $.ajax({
     type : "POST",
     url : "postCode.php",
     data: {id : bufferId},
     dataType: "html",
     success: function(data){ 
       alert("ok");  
     }
  });
});

Mi código php:

$handle = fopen("test.html", 'w+');
$data = $_POST['id'];
if($handle) {
    if(!fwrite($handle, $data )) {
        echo "ok";
    }
}

El resultado final de lo que se escribe en test.html:

<div id="mainCode"></div>

Cuando realmente necesito:

<div id="mainCode">
  [dynamic content that is added by the user via ajax]
</div>
0
jeanhules 29 ago. 2014 a las 23:36

2 respuestas

La mejor respuesta

También puede usar un objeto diferido devuelto por $ .ajax para ejecutar la segunda solicitud ajax después de la primera:

headerURL = $(".header-code").attr('data-url');
$.ajax({
    url: headerURL,
    data: "function=showCode",
    success: function(data){
      $('code #mainCode').append(data);
    }
}).done(
  function() {
    var bufferId =$("#mainCode").html();
    $.ajax({
       type : "POST",
       url : "postCode.php",
       data: {id : bufferId},
       dataType: "html",
       success: function(data){ 
         alert("ok");  
       }
    }); 
  }
)
1
Vasily 29 ago. 2014 a las 20:29

Emita una segunda llamada AJAX después de que la primera llamada agregue contenido. Cambie el código de JavaScript a:

$("#getSource").on('click', function(){

  headerURL = $(".header-code").attr('data-url');
  $.ajax({
    url: headerURL,
    data: "function=showCode",
    success: function(data){
      $('code #mainCode').append(data);

      // second ajax call
      var bufferId =$("#mainCode").html();
      $.ajax({
         type : "POST",
         url : "postCode.php",
         data: {id : bufferId},
         dataType: "html",
         success: function(data){ 
           alert("ok");  
         }
      });
    }
  });
});
1
Rimas 29 ago. 2014 a las 20:17