Return selected row to the controller

cehepker

I am new to MVC and using DataTables. I need to return the selected row to the controller. I have read the examples of javascript and see how I can get the information from the selected row, but I don't know how to return the row data to the controller.

@model IEnumerable<DAL.ViewModels.JDE_OrderViewModel>

<script type="text/javascript" src="~/Scripts/jquery-3.3.1.js"></script>
<script type="text/javascript" src="~/Scripts/jquery.validate.js"></script>
<script type="text/javascript" src="~/Scripts/bootstrap.js"></script>
<script type="text/javascript" src="~/Scripts/DataTables/datatables.js"></script>



@{
    Layout = "~/Views/Shared/_LayoutForDataTables.cshtml";
}

@{
    ViewBag.Title = "EnterJDE Number";
}

<h2>@ViewBag.Title</h2>

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <h4>JDE Number</h4>
        <hr />


        <div class="row">
            <div class="col-md-offset-1 col-md-6">
                <table class="table">
                    <tr>
                        <th>Trailer Number</th>
                        <th>Carrier</th>
                    </tr>
                    <tr>
                        <td>@ViewBag.TrailerNumber</td>
                        <td>@ViewBag.Carrier</td>
                    </tr>
                </table>
            </div>
        </div>

        <div class="row">
            <div class="col-md-offset-1 col-md-6">
                <table class="table" id="jdeOrderTable">
                    <thead>
                        <tr>
                            <th>JDE Order</th>
                            <th>Whse</th>
                            <th>WhseName</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach (var item in Model)
                        {
                            <tr>
                                <td>
                                    @Html.DisplayFor(modelItem => item.JDE_Order)
                                </td>
                                <td>
                                    @Html.DisplayFor(modelItem => item.Whse)
                                </td>
                                <td>
                                    @Html.DisplayFor(modelItem => item.WhseName)
                                </td>
                            </tr>
                        }
                    </tbody>
                </table>
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Save" class="btn btn-success" id="btnGetData"/>
            </div>
        </div>

    </div>
}
<div>
    @Html.Partial("_BackToListButtonPartial")
</div>

<script type="text/javascript">
    $(document).ready(function ()
    {
        var options =
        {
            "paging": false,
            "select": true,
        };
        $('#jdeOrderTable').DataTable(options);

    });

    // button event handler for getting the data for selected rows.
    $("#btnGetData").click(function () {
        var selData = table.rows(".selected").data();
        alert(selData.length);
    });

Edited by Allan - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

allan

You'd need to make an Ajax call to the server with the data you want. See the jQuery Ajax documentation to help get you started with making Ajax calls.

Allan