Получение входного значения для метода действия.Mvc Core & AJAX - PullRequest
Новая
       20

Получение входного значения для метода действия.Mvc Core & AJAX

0 голосов
/ 12 февраля 2019

Я новичок в MVC Core, и у меня возникают некоторые трудности с получением этого права.

У меня есть таблица, заполненная некоторыми базовыми значениями из моих продуктов, и я хочу отправитьколичество значение и идентификатор продукта для моего метода действия.У меня проблема в том, что я могу отправить свой product.ID методу действия, но я не могу получить свое входное значение.Я попытался использовать кнопку вместо моего элемента, и когда я использовал это, мне удалось получить ввод, но не product.ID. 

@model List<Product>

<div id="productList">
    <form>
        <table>
            @foreach (var product in Model)
            {
                <tr>
                    <td>@product.Name</td>
                    <td>@product.Price</td>
                    <td><input type="text" name="quantity" /></td>
                    <td>
                        <a
                           asp-action="AddProductToCart"
                           asp-route-id="@product.ID"
                           data-ajax="true"
                           data-ajax-method="GET"
                           data-ajax-mode="replace"
                           data-ajax-update="#cartinfo">Add to basket</a>
                    </td>
                </tr>
            }
        </table>
    </form>
</div>

<div id="cartinfo">

</div>

Мои параметры методов действия выглядят так: 

public IActionResult AddProductToCart(int id, int quantity)

Я уверен, что мне не хватает некоторых базовых знаний о том, как работают формы, поэтому я очень признателен за помощь здесь.Я пытался гуглить это, но я тоже борюсь с этим.Большое спасибо

Ответы [ 2 ]

0 голосов
/ 13 февраля 2019

Вы можете попытаться вставить атрибут data-ajax в <form> и внести следующие изменения в ваше представление и параметр в действии 

<div id="productList">
    <table>
        @foreach (var product in Model)
        {
            <tr>
              <form data-ajax="true"
                       data-ajax-url="/Your controllerName/AddProductToCart"
                       data-ajax-method="Post"
                       data-ajax-mode="replace"
                       data-ajax-update="#cartinfo">
               <td>@product.Name</td>
                <td>@product.Price</td>

                <td>
                    <input type="text"  asp-for="@product.quantity"/>
                    <input asp-for="@product.Id" hidden />
                </td>
                <td>
                    <input type="submit" value="Add to basket"/>
                </td>
             </form>
            </tr>
        }
    </table>

Измените параметры на объект модели, обратите внимание, что имя параметра должно соответствовать имени данных, передаваемых со стороны клиента 

[HttpPost]
    public IActionResult AddProductToCart( Product product)
    {
        //the stuff you want
    }
0 голосов
/ 12 февраля 2019

Вместо этого вы можете использовать javascript. 

@model List<Product>

<div id="productList">
    <form>
        <table>
            @foreach (var product in Model)
            {
                <tr>
                   <td style="visibility:hidden" class="pID">@product.ID</td>
                    <td>@product.Name</td>
                    <td>@product.Price</td>
                    <td><input type="text" name="quantity" class="qty"/></td>
                    <td>

                     <button class="btnAdd" >Add to basket</button>
                    </td>
                </tr>
            }
        </table>
    </form>
</div>

<div id="cartinfo">

</div>

java script 

<script type="text/javascript">

    $(document).ready(function () {

        $('.btnAdd').click(function () {
            var PID= $(this).closest("tr").find(".pID").text();
            var Pqty= $(this).closest("tr").find(".qty").text();

            AddtoCart(PID, Pqty);
        });

    }); 

    function AddtoCart(pid,qty) {
            $.ajax({
                url: "@Url.Action("AddProductToCart", "Your Controller")",
                type: 'GET',
                data: { id: pid, quantity: qty},
                datatype: 'json',

                success: function (data) {

                    $('#cartinfo').html(data);

                }
            });
        }

</script>

Надеюсь, это вам поможет!

...