@{
    ViewData["Title"] = "Оплата операции";
}
<div>
    <h2 class="display-4">@ViewData["Title"]</h2>
</div>
<form method="post">
    <div class="row mb-2">
        <div class="col-2">Сделки:</div>
        <div class="col-sm-10">
            <select id="purchase" name="purchase" class="form-control" asp-items="@(new SelectList(@ViewBag.Purchases, "Id", "Id"))"></select>
        </div>
    </div>
    <div class="row mb-2">
        <div class="col-2">Операции:</div>
        <div class="col-sm-10">
            <select id="car" name="car" class="form-control"></select>
        </div>
    </div>
    <div class="row mb-2">
        <div class="col-2">Внесенная сумма:</div>
        <div class="col-sm-10">
            <input type="number" class="form-control" name ="paidSum" id="paidSum" placeholder="Внесенная сумма" readonly>
        </div>
    </div>
    <div class="row mb-2">
        <div class="col-2">Сумма к оплате:</div>
        <div class="col-sm-10">
            <input type="number" class="form-control" name="resultSum" id="resultSum" placeholder="Сумма к оплате">
        </div>
    </div>
    <div class="text-center mb-2">
        <input type="submit" value="Оплатить" class="btn btn-primary" id="submit" />
    </div>
</form>

@section Scripts
    {
        <script>
        $('#purchase').on('change', updateInspections);
        $('#car').on('change', check);
        updateInspections();

        function updateInspections() {
            $.get({
                url: "/Home/GetOperations",
                    data: { purchase: $('#purchase').val() },
                success: function(data) {
                    $('#car').empty();
                    $.each(data, function(i, car) 
                    {
                        $('#car').append( new Option(car.mark +" "+ car.model, car.id) );
                    });
                    $('#car').val(data[0].id).change();
                }
            });
        }

        function check() {
            var paidSum = $('#paidSum').val();
            var purchase = $('#purchase').val();
            var car = $('#car').val();
            if (true) {
                $.ajax({
                    method: "POST",
                    url: "/Home/CalcPrice",
                    data: { paidSum: paidSum, purchase: purchase, car: car },
                    success: function (result) {
                        console.log(result);
                        $("#paidSum").val(result.item1);
                        $("#resultSum").val(result.item2);
                    }
                });
            };
        }
        </script>
}