Increase Prices 10 percent by ajax in asp.net core

Question

I have some prices in my web site(asp.net core) .I wanna to add 10 percent to all of them by click a button and change all of them just by click a button .I wrote a service to add 10 percent to each price and there is a controller and in view I have a button . but it does not work.How should Icorrect it? this is my code .

public interface IUpdatePricesService
{
    ResultDto Execute(RequestUpdatePricesDto request);
}
public class UpdatePricesService : IUpdatePricesService
{
    private readonly IDataBaseContext _context;
    public UpdatePricesService(IDataBaseContext context)
    {
        _context = context;
    }
    public ResultDto Execute(RequestUpdatePricesDto request)
    {
        List<UpdatePrices> updatePrices = new List<UpdatePrices>();
        UpdatePrices prices = new UpdatePrices();
        foreach (var item in request.prices)
        {    
            int p = Convert.ToInt32(prices);
            p = p / 10;
            p = p + p;
            item.Price=p;
            
            updatePrices.Add(prices);
        };
        _context.SaveChanges();
        return new ResultDto
        {
            IsSuccess = true,
            Message = "Updated",
        };
    }
}


    private readonly IUpdatePricesService _updatePrices;


    [HttpPost]
    public IActionResult UpdatePricesInProduct()
    {

        var result = _updatePrices.Execute(new RequestUpdatePricesDto { });

        return Json(result);

    }


                                    <div class="col-xl-12 col-lg-12 col-md-12 mb-1">
                                        <fieldset class="form-group">
                                            <br />
                                            <a id="btnIncrease" class="btn btn-success col-md-12"> افزودن   </a>
                                        </fieldset>
                                    </div>
    <script>

    $(document).ready(function () {

        $('#btnIncrease').click(function () {

            $.ajax({

                contentType: 'application/x-www-form-urlencoded',
                dataType: 'json',
                url: "UpdatePricesInProduct",
                type: "POST",
                data: postData,
                cache: false,
                async: true,
                success: function (data) {
                    alert(data);
                }
            });
        })

</script>

Answer 1

Updated Answer As Per Comment:

"In Ajax the UpatePriceByAjax controller , do not works"

It shouldn't work the way you have written that. Because your ajax request is not in correct format.

"Ajax error explanation"

If you debug your code on browser you should get either of following error at the begining. You have written Jquery like this way <script> </script> which generating either of following error. Additionally, your jquery has not ended correctly you have missed or have not posted accordingly }); end braces are missing.

How to resolve that error

You should write your script using following way: So that there will be no error at the begining.

@section scripts {
    <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script>
    <script>
        $(document).ready(function () {
            alert("Click");// Write your code here
        });
    </script>
}

"Another error you may get in Ajax"

data: postdata you haven't define what you are posting. I think for this price update request you don't need to post/submit any data as this method UpdatePricesInProduct does need anything as per your code.

"Finally Valid Ajax Request You should Write"

<div class="col-xl-12 col-lg-12 col-md-12 mb-1">
    <fieldset class="form-group">
        <br />
        <a id="btnIncrease" class="btn btn-success col-md-12"> ??????   </a>
    </fieldset>
</div>
@section scripts {
    <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script>
    <script>
        $(document).ready(function () {
            $('#btnIncrease').click(function () {
                alert("btnIncrease");
                $.ajax({
                    contenttype: 'application/x-www-form-urlencoded',
                    datatype: 'json',
                    url: "updatepricesinproduct",
                    type: "post",
                 //   data: postdata,
                    cache: false,
                    async: true,
                    success: function (data) {
                        alert(data);
                    }
                });
            });

        });
    </script>
}

"Output:"

Note: You should have above changes to get rid of your problem and make it workable as expected.

Previous Answer And Working Sample:

Let say I have price list in my web site like below:

If now if you would like to update all price in the list together with just a single button click then you could follow below steps:

HTML/Ajax:

<div class="col-xl-12 col-lg-12 col-md-12 mb-1">
    <fieldset class="form-group">
        <br />
        <a id="btnIncrease" class="btn btn-success col-md-12"> ?????? Update Price </a>
    </fieldset>
</div>

Javascript/Ajax:

@section scripts {
    <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script>
    <script>
        $(document).ready(function () {
           
            $("#btnIncrease").click(function (e) {
                alert("Fired!");
                $.ajax("https://localhost:44361/UserLog/UpatePriceByAjax", {
                    method: "POST",
                    dataType: "json",
                    contentType: "application/json",
                    success: function (data) {
                       
                        console.log(data);
                       
                    }
                });
                alert("Successfully Updated");
                location.reload(true);
            });

            
        });
    </script>
}

C# Asp.net Core Controller

[HttpPost]
public ActionResult UpatePriceByAjax()
{
    decimal incrementPercentage = 10;
    List<PriceUpdateTable> ExistingPriceList = _context.priceUpdateTable.ToList();

    foreach (var item in ExistingPriceList)
    {
        var updatedPricePercentage = item.Price * incrementPercentage / 100;
        item.UpdatedPrice = item.Price + updatedPricePercentage;
        _context.Update(item);

    }
    _context.SaveChanges();

    return RedirectToAction("GetUpdatedPrice");
}

C# Asp.net View

@model IEnumerable<MVCApps.Models.PriceUpdateTable>

@{
    ViewData["Title"] = "GetUpdatedPrice";
}

<h2>Get Updated Price</h2>


<table class="table">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.ItemName)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Price)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.UpdatedPrice)
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.ItemName)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Price)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.UpdatedPrice)
                </td>
                <td>
                    <a asp-action="Edit" asp-route-id="@item.ItemId">Edit</a> |
                    <a asp-action="Details" asp-route-id="@item.ItemId">Details</a> |
                    <a asp-action="Delete" asp-route-id="@item.ItemId">Delete</a>
                </td>
            </tr>
        }
    </tbody>
</table>

C# Asp.net Controller For Above View

public async Task<IActionResult> GetUpdatedPrice()
        {
            var updatedPrice = await _context.priceUpdateTable.ToListAsync();
            return View(updatedPrice);
        }
    

Output

Note: This is scenario for you. Howevery, you can get the idea how you could implement that. Just modify the example as per your requirement.

Hope avobe steps guided you accordingly. If you encounter further concern feel free to share us.