How can I create my own post request, using data from the table?

gs2589

So Im using the Editor to allow the user to generate a table - a purchase order (PO)- with items they want to buy. Once they are done inputting all of the data, I want to have the user click a "Generate PO" button, and have that send a POST request to the server for PO generation. I have the whole editor part set. Im stuck with the POST request.

I created a separate button who's event listener executes the function below triggering the ajax call

$('#generate-po').on( 'click', function () {
var purchase_data=t.data(); // t is the global variable my DataTable is attached to.
generatePo(purchase_data);
});

function generatePo(purchase_data){
$.ajax({
url: '/procurement_lineitems',
method: 'POST',
data: purchase_data,
success: function(response){
$('#loading-image').hide();
},
error: function(response){
alert("There was an error. Please contact the system administrator" + response)
$('#loading-image').hide();
}
})
};

The browser is freezing and the throwing an " Uncaught RangeError: Maximum call stack size exceeded". It never hits the server.
I tried this with replacing purchase_data with {test: "hello"} and there were no issues, which leads me to believe that the issue here is related to the structure of purchase_data which is equal to t.data(). When I tried to JSON.stringify(t.data()) I got a "Converting circular structure to JSON" error. This makes me think that t.data() produces some sort of complex object that first hast to be turned into a simpler one before it can be sent as a post request. Any thoughts on what that may be?

Also, perhaps there is a better way to do this altogether that I should use instead? Thanks so much!

Sorry if some of the questions here are too beginner, Im just finding my way with JavaScript.

If its relevant, Im working on Rails in the back end.

gs2589

Actually, I just found a solutions here:

https://datatables.net/forums/discussion/21421/getting-data-back-out-of-a-datatable-and-submitting-it-as-json

If someone thinks that there is a more 'DataTablesy' way of doing this, I'd love to hear those thoughs.

kthorngren

I put together this example to show how to build the columns from the AJAX data. The AJAX Success function uses a callback to ensure its complete before initializing Datatables.

http://live.datatables.net/fafuyeyu/1/edit

You can change the type to POST.

Kevin

allan

I suspect that you might have marked Kevin's answer as Rejected as it appears to be for a different topic - possibly a cross post, but it would be helpful if you could say.

Regardless, to get the data from the table, as discussed in the other thread, you would use table.rows().data().toArray(). That's about as DataTablesy as it gets!

Allan

gs2589

Thanks Allan. Yes, Kevin's answered seemed to be for a different topic. Apologies for not pointing that out.
Gabriel