serialize a client-side made string to a server-side file angularJS - angularjs

Question

So i'm building a string which is actually an xml file. Since i can't save any file from client-side for security issues, i'd like to save this string in a xml file server-side.
i've read about $http method or upload plugin but it seems a bit a complicated for just sending a string to my server.
is there an easier way to do it?
For informative purpose, here is my code :
$scope.addBlock = function(){
if($scope.parentblock == null)//creation of a lvl1 element
{
var div = document.createElement("div");
//xml creation
var elmt = document.createElement($scope.selectedtype.tagname);
//
div.setAttribute('id',$scope.blocktitle);
div.setAttribute('lvl',0);
var path = '/'+$scope.selectedtype.tagname;
div.setAttribute('path',path);
div.innerHTML = '<h1>' + $scope.blocktitle + '</h1><p> path : '+ path + '</p>';
if($scope.blockvalue)
{
div.innerHTML = div.innerHTML + '<p>' + $scope.blockvalue + '</p>';
//adding value to xml tag
elmt.innerHTML = $scope.blockvalue;
//
}
document.getElementById('blocks').appendChild(div);
//xml adding
doc.appendChild(elmt);
console.log(doc);
//
$scope.blocks.push([$scope.blocktitle,$scope.selectedtype.tagname,$scope.parentblock,path]);
}
else //creation of a lvl n element
{
var div = document.createElement("div");
//xml creation
var elmt = document.createElement($scope.selectedtype.tagname);
//
div.setAttribute('id',$scope.blocktitle);
var lvl = Number(document.getElementById($scope.parentblock[0]).getAttribute('lvl'))+1;
div.setAttribute('lvl',lvl);
var path = ($scope.parentblock[3]+'/'+$scope.selectedtype.tagname);
div.innerHTML = '<h2>' + (new Array(lvl + 1).join("&nbsp")) + $scope.blocktitle +
'</h2><p>' + (new Array(lvl + 5).join("&nbsp")) + ' path : '+ path + '</p>';
if($scope.blockvalue)
{
div.innerHTML = div.innerHTML + '<p>' + (new Array(lvl + 5).join("&nbsp")) +
$scope.blockvalue + '</p>';
//adding value to xml tag
elmt.innerHTML = $scope.blockvalue;
//
}
document.getElementById($scope.parentblock[0]).appendChild(div);
//xml adding
doc.getElementsByTagName($scope.parentblock[1].toLowerCase())[0].appendChild(elmt);
//
$scope.blocks.push([$scope.blocktitle,$scope.selectedtype.tagname,$scope.parentblock,path]);
}
//console.log(doc);
}
I need to send doc to my server.
EDIT :
i really need to send an xml since is a iso19110-normalized file that i have to save.
I tried this :
$http({
method: 'POST',
url: 'save.php',
data: { 'doc' : doc.outerHTML },
headers: {'Content-Type': 'text/xml'}
})
.success(function(data){
alert(data);
})
.error(function(){
alert('fail');
});
and this in php :
file_put_contents('test.xml', $_POST['doc'])
but i've got "index doc undefined" ...
I also tried
$http.post('save.php',doc).success(function() {
return console.log('uploaded');
});
but i got 'Converting circular structure to JSON'
So i think my problem come from the location of the data. I can't figure where it is...

Answer 1

If you need to send a lump of text to your server (over http) then you should use the $http.post() method. Its easy to use and works like a charm. You can receive and save the data on the server in any number of ways, presumably you have this bit worked out?
The real issue from your question, imo, is whether you really need to be sending xml? A much easier way of sending your data would be to use JSON. Then you don't need to go through all that document building rigmarole. Instead you can just build a javascript object and send it using the $http.post() method letting angular do all the work for you.
var doc;
doc = {
id: $scope.blocktitle,
lvl: 0
// rest of your doc structure here
};
$http.post('/my-url/upload/doc', doc).success(function() {
return console.log('uploaded');
});