For Updating the Data

To Pass Single Value

View:

@model IEnumerable<Saadhvi_Services.Models.Grossery>

@{
    ViewBag.Title = "GrosseryList";

}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h2>GrosseryList</h2>

<p>
    @Html.ActionLink("Create New", "Create")
</p>
<table class="table">
    <tr>
        <th>

            @Html.Label("S.No")
        </th>
        <th>
            @Html.Label("ShipmentNo")
        </th>
        <th>
            @Html.Label("Date")
        </th>
        <th>
            @Html.Label("DestinationCode")
        </th>
        <th>
            @Html.Label("Destination")
        </th>
        <th>
            @Html.Label("VehicleNo")
        </th>
        <th>
            @Html.Label("Tonnage")
        </th>
        <th>
            @Html.Label("Bill Amount")
        </th>
        <th>
            @Html.Label("Waiting charge")
        </th>
        <th>
            @Html.Label("Extra Point")
        </th>
        <th>
            @Html.Label("Total Amount")
        </th>

        <th></th>
    </tr>

    @if (Model != null)
    {
        int j = 0;
        foreach (var item in Model)
        {

            <tr>
                <td><input type="text" name="name" value="@item.Id" id="id@(j)" /></td>
                <td>
                    @Html.DisplayFor(modelItem => item.ShipmentNo)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Date)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.DestinationCode)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Destination)
                </td>
                <td>
                    <input type="text" name="" value="@item.Transportername" class="form-control" />
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Tonnage)
                </td>
                <td>
                    <input type="text" name="actualamount" value="@item.actualamount" class="form-control" />
                </td>
                <td>
                    <input type="text" id="waitingcharge@(j)" name="waitingcharge" onchange="f1()" oninput="f1()" value="" class="form-control" />
                </td>
                <td>
                    <input type="text" id="extrapoint@(j)" name="extrapoint" value="" onchange="f1()" oninput="f1()" class="form-control" />
                </td>
                <td>
                    <input type="text" id="totalamount@(j)" name="totalamount" value="" class="form-control" />
                </td>

                <td>
                    <input type="button" name="name" value="Update" id="update" />
                    @*@Html.ActionLink("Edit", "Edit", new { id=item.Id }) |
                    @Html.ActionLink("Details", "Details", new { id=item.Id }) |
                    @Html.ActionLink("Delete", "Delete", new { id=item.Id })*@
                </td>
            </tr>
            j++;
        }
    }
</table>
<script>
    $(document).ready(function () {
        $('#update').click (function()
        {
            var std = {};
            std.Id = '1';
            std.actualamount = '100';
            std.Transporternameaju = 'raju';
            std.Date = '8/2/2018 9:45:17 AM';
            std.ShipmentNo = 'raju';
            std.DestinationCode = 'raju';
            std.LrNo = 'raju';
            std.Destination = 'raju';
            std.Transportername = 'raju';
            std.contactno = 'raju';
            std.Tonnage = 'raju';
         
            std.loadingunloading = 'raju';
            std.adv = 'raju';
            std.podbalance = 'raju';
            std.remarks = 'raju';
            $.ajax({

                type: "POST",
                data:JSON.stringify(std),
                //data: '{grossery: ' + JSON.stringify(std) + '}',
                dataType: "json",
                url: '/Grossery/Edit',
                contentType: "application/json; charset=utf-8",
                success: function () {
                    alert("Data has been added successfully.");
                 
                },
                error: function () {
                    alert("Error while inserting data");
                }
            });
        })
    })
</script>

<script>
    $(document).ready(function () {
        var waiting = $('#waitingcharge').val();
        var point = $('#extrapoint').val();


    })

    function f1() {
        if (!isNaN(parseInt($('#waitingcharge').val())) && !isNaN(parseInt($('#extrapoint').val()))) {
            var x = parseInt($('#waitingcharge').val()) + parseInt($('#extrapoint').val())
            $('#totalamount').val(x);
        }
    }
    function f2() {
        alert("change");

    }




</script>


To Pass Multiple Values in View:

@model IEnumerable<Saadhvi_Services.Models.Grossery>

@{
    ViewBag.Title = "GrosseryList";

}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<h2>GrosseryList</h2>

<p>
    @Html.ActionLink("Create New", "Create")
</p>
<table class="table">
    <thead>
        <tr>
            <th>

                @Html.Label("S.No")
            </th>
            <th>
                @Html.Label("ShipmentNo")
            </th>
            <th>
                @Html.Label("Date")
            </th>
            <th>
                @Html.Label("DestinationCode")
            </th>
            <th>
                @Html.Label("Destination")
            </th>
            <th>
                @Html.Label("VehicleNo")
            </th>
            <th>
                @Html.Label("Tonnage")
            </th>
            <th>
                @Html.Label("Bill Amount")
            </th>
            <th>
                @Html.Label("Waiting charge")
            </th>
            <th>
                @Html.Label("Extra Point")
            </th>
            <th>
                @Html.Label("Total Amount")
            </th>

            <th></th>
        </tr>
    </thead>
    <tbody>
    @if (Model != null)
    {
        int j = 1;
        foreach (var item in Model)
        {

            <tr>
                <td><input type="text" name="name" value="@j" id="id@(j)" class="form-control"/></td>
                <td>
                    @Html.DisplayFor(modelItem => item.ShipmentNo)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Date)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.DestinationCode)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Destination)
                </td>
                <td>
                    <input type="text" name="" value="@item.Transportername" class="form-control" />
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Tonnage)
                </td>
                <td>
                    <input type="text" name="actualamount" value="@item.actualamount" class="form-control" />
                </td>
                <td>
                    <input type="text" id="waitingcharge@(j)" name="waitingcharge" onchange="f1()" oninput="f1()" value="" class="form-control" />
                </td>
                <td>
                    <input type="text" id="extrapoint@(j)" name="extrapoint" value="" onchange="f1()" oninput="f1()" class="form-control" />
                </td>
                <td>
                    <input type="text" id="totalamount@(j)" name="totalamount" value="" class="form-control" />
                </td>

                <td>
                 
                    @*@Html.ActionLink("Edit", "Edit", new { id=item.Id }) |
                    @Html.ActionLink("Details", "Details", new { id=item.Id }) |
                    @Html.ActionLink("Delete", "Delete", new { id=item.Id })*@
                </td>
            </tr>
            j++;
        }
    }
    </tbody>
</table>
<input type="button" name="name" value="Update" class="update btn-default" />
<script>
    $(document).ready(function () {
        $('.update').click(function () {
            var stds = new Array();

            $('.table tbody tr').each(function () {
                var row = $(this);
                var std = {};
                std.Id = $(this).closest("tr").find("td:eq(0) input[type='text']").val();
                std.actualamount = $(this).closest("tr").find("td:eq(7) input[type='text']").val();
                std.Transportername = $(this).closest("tr").find("td:eq(5) input[type='text']").val();
                std.Date = $(this).closest("tr").find("td:eq(2)").text().trim();
                std.ShipmentNo = $(this).closest("tr").find("td:eq(1)").text().trim();
                std.DestinationCode = $(this).closest("tr").find("td:eq(3)").text().trim();
                std.LrNo = 'raju';
                std.Destination = $(this).closest("tr").find("td:eq(4)").text().trim();

                std.contactno = 'raju';
                std.Tonnage = $(this).closest("tr").find("td:eq(6)").text().trim();

                std.loadingunloading = 'raju';
                std.adv = 'raju';
                std.podbalance = 'raju';
                std.remarks = 'raju';
                stds.push(std);
            });
            $.ajax({

                type: "POST",
                data: JSON.stringify(stds),
                //data: '{grossery: ' + JSON.stringify(std) + '}',
                dataType: "json",
                url: '/Grossery/Edit',
                contentType: "application/json; charset=utf-8",
                success: function () {
                    alert("Data has been added successfully.");

                },
                error: function () {
                    alert("Error while inserting data");
                }
            });
        })
    });
</script>

<script>
    $(document).ready(function () {
        var waiting = $('#waitingcharge').val();
        var point = $('#extrapoint').val();


    })

    function f1() {
        if (!isNaN(parseInt($('#waitingcharge').val())) && !isNaN(parseInt($('#extrapoint').val()))) {
            var x = parseInt($('#waitingcharge').val()) + parseInt($('#extrapoint').val())
            $('#totalamount').val(x);
        }
    }
    function f2() {
        alert("change");

    }




</script>