Reputation: 235
I am trying to write the content of a div
to a new html file. The content of the div
is being generated by ajax itself, so when I try to post the contents to a new file, all that is being written to the file is the raw html. Is there a way to write the div
contents of the 'ajaxed in' content?
This is my ajax code:
$("#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");
}
});
});
my php code:
$handle = fopen("test.html", 'w+');
$data = $_POST['id'];
if($handle) {
if(!fwrite($handle, $data )) {
echo "ok";
}
}
the end result of whats being written in test.html
:
<div id="mainCode"></div>
when I really need:
<div id="mainCode">
[dynamic content that is added by the user via ajax]
</div>
Upvotes: 0
Views: 107
Reputation: 1958
You also can use a deffered object returned by $.ajax to run second ajax request after the first one:
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");
}
});
}
)
Upvotes: 1
Reputation: 6024
Issue second AJAX call after first call appends content. Change JavaScritp code to:
$("#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");
}
});
}
});
});
Upvotes: 1