Multi tool use

Clash Royale CLAN TAG

How to post a WebGrid to a Controller using Ajax

I want to post the full WebGrid from my view to my controller using ajax. In this WebGrid I display a table from a database and I want to provide, that the user of this webpage can update the columns (in the database).

WebGrid

WebGrid

My try so far:

public JsonResult UpdateTable(GridView model)
{
// Update Model to db..
string message = "Success";
return Json(message, JsonRequestBehavior.AllowGet);
}


The GridView model here has always 0 columns.

GridView model

WebGrid

<div id="tableGridDiv">
@grid.GetHtml(
tableStyle: "table", columns: cols)
</div>


Script

$('.save-user').on('click', function () {
var grid = $("#tableGridDiv").find("table.grid").first();
alert(grid.innerHTML);
var jsonGrid = JSON.stringify(grid);
//var jsonGrid = $.parseJSON(grid);
alert(jsonGrid);
$.ajax({
url: '/Home/UpdateTable/',
data: jsonGrid,
datatype: JSON,
type: 'POST',
contentType: 'application/json, charset=utf-8',
success: function (data) {
alert(data);
}
});


The outcome of alert(jsonGrid) is:

alert(jsonGrid)

{"length":0,"prevObject":{"length":0,"prevObject":{"0":{"__browserLink_sourceMapping":["~/Views/Home/ViewTable.cshtml","div#tableGridDiv",4717,104,23]},"length":1,"context":{"location":{"href":"http://localhost:56452/Home/ViewTable?View=0","ancestorOrigins":{},"origin":"http://localhost:56452","protocol":"http:","host":"localhost:56452","hostname":"localhost","port":"56452","pathname":"/Home/ViewTable","search":"?View=0","hash":""},"_html5shiv":1,"jQuery110201336937122154982":1},"selector":"#tableGridDiv"},"context":{"location":{"href":"http://localhost:56452/Home/ViewTable?View=0","ancestorOrigins":{},"origin":"http://localhost:56452","protocol":"http:","host":"localhost:56452","hostname":"localhost","port":"56452","pathname":"/Home/ViewTable","search":"?View=0","hash":""},"_html5shiv":1,"jQuery110201336937122154982":1},"selector":"#tableGridDiv table.grid"},"context":{"location":{"href":"http://localhost:56452/Home/ViewTable?View=0","ancestorOrigins":{},"origin":"http://localhost:56452","protocol":"http:","host":"localhost:56452","hostname":"localhost","port":"56452","pathname":"/Home/ViewTable","search":"?View=0","hash":""},"_html5shiv":1,"jQuery110201336937122154982":1}}

I can't see columns or anything like that in here, so I guess I need something different?

jsonGrid

GridView

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.