How to pass form values to the controller and return values to the jQuery datatables

Question

What I want to do is like this.
After I submit the forms, values in the forms are passed to the controller, and the values are transformed and returned to the datatable.

I know how to return json data to the datatable from the controller.
Also I know how to pass form values to the controller by Ajax.BeginForm.
But I don't know how to do the both.
Here is my code that just returns fixed json data to the datatables.

View

    <script type="text/javascript">

        function PullIntoTable() {
            $('#example').dataTable({
                "bDestroy": true,
                "bAutoWidth": false,
                "aoColumns": [
                { sWidth: '30%' },
                { sWidth: '10%' },
                { sWidth: '20%' },
                { sWidth: '20%' },
                { sWidth: '20%' }, ],
                "sAjaxSource": '@Url.Action("Search", "SearchCompany")',
                "fnServerData": function (sSource, aoData, fnCallback) {
                    $.ajax({
                        dataType: 'json',
                        type: "POST",
                        url: sSource,
                        data: aoData,
                        success: function (json) {
                            fnCallback(json);
                        }
                    })
                }
            });
        };

    </script>

    <input type="submit" value="Search" onclick="PullIntoTable()" />


<table cellpadding="0" cellspacing="0" border="0" class="search_result" id="example" width="100%">
    <thead>
        <tr>
            <th>Company</th>
            <th>Location</th>
            <th>Address</th>
            <th>Status</th>
            <th>Inactive</th>
        </tr>
    </thead>
    <tbody>
    </tbody>
    <tfoot>
        <tr>
            <th></th>
            <th></th>
            <th></th>
            <th></th>
            <th></th>
        </tr>
    </tfoot>
</table>

Controller

public class SearchCompanyController : Controller
{
    [HttpPost]
    public ActionResult Search()
    {
        var Result = new List<Result>()
        {
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"},
            new Result{Name="DummyCompany", Location="DummyLocation", Address="DummyAddress", Status="SL", Inactive="Y"}
        };

        return Json(
            new { aaData = Result.Select(x => new[] { x.Name, x.Location, x.Address, x.Status, x.Inactive }) },
            JsonRequestBehavior.DenyGet
            );
    }
}

public struct Result
{
    public string Name { get; set; }
    public string Location { get; set; }
    public string Address { get; set; }
    public string Status { get; set; }
    public string Inactive { get; set; }
}

Answer 1

Datatables requires the data in a very specific format .

There's an example using OpenSearch , which you can glean details to use for your specific implementation (ie, a non-datatables specific implementation in which you construct the json object in javascript for the callback). This solution appeals to me the most because it keeps the datatables-specific implementation details out of your server-side code.

There are already asp.net samples on the datatables.net site that give you largely everything you need, albeit in rather ugly hungarian notation format.

I don't have a sample at my fingertips, but I did take the c# sample and convert it into an actionfilter so I did not have to to deal with the hungarian notation. If I lay my hands on it, and you're interested, I'll see if I can post it up here.

Answer 2

It was solved.
I could get values from the controllers and pull them into the datatable like the following

View Script

function PullIntoTable(e) {
    $('#example').dataTable({
        "bDestroy": true,
        "bAutoWidth": false,
        "aoColumns": [
        { sWidth: '30%' },
        { sWidth: '10%' },
        { sWidth: '20%' },
        { sWidth: '20%' },
        { sWidth: '20%' }, ],
        "aaData": e.aaData
    });
};