单击后如何禁用asp-action链接

Question

我想在单击后禁用 asp=action 链接 我有一个 foreach 循环可以在我的视图中的表格中显示我的书 我在购物车中添加书籍的 asp-action 正在循环中，但我只想禁用已经在购物车中的书籍而不是所有书籍

 <a asp-action="AcheterLivre" asp-Controller="Achat" asp-route-id="@item.Isbn" id="disabled" onclick="return myFunction(this);"> Ajouter 

我用 jquery 尝试了一些东西，但效果不好

我试过了

 <script>
function myFunction() {
    $("#disabled").one("click", function () {
        alert("this book is already in the cart");
    });
}

我的课堂上有这个功能 它验证书籍是否在购物车中，也许我应该使用它？

public bool IsPresent(string isbn)
    {
        //rechercher si l'isbn correspond a un livre de la liste
        AchatLivreViewModel livre = ListeElements.Find(element => element.Isbn == isbn);
        if (livre != null)
        {
            return true;
        }
        else
        {
            return false;
        }
    }

Answer 1

为什么不试试这个简单的方法：

<tbody>
    @foreach (var item in Model)
            {            
                <tr>
                    <td>
                        @item.Isbn
                    </td>                
                    <td>
                        @item.Titre
                    </td>
                    <td>
                        <label class="btn btn-primary" style="padding:0"><a href="/Home/About" class="ADD2CART" style="display:block">Add to Cart</a></label>
                    </td>
                    <td>
                        <label class="btn btn-danger" style="padding:0"><a href="/Home/About" class="RemoveFromCART" style="display:block">Remove From Cart</a></label>
                    </td>

                </tr>                    
        }
</tbody>

在您的 javascript 中，如果您不想使用 Ajax，您可以使用对象数组在客户端管理您的购物车项目，我们将其命名为 CartItems：

    var CartItems = [];

    $('.ADD2CART').click(function () {
            if ($(this).closest('tr').hasClass("ExistingInCart")) {
                alert('Already in Cart !!');                
            }
            else {
                // add this item to the Cart through Ajax or 
                // local javascript object: e.g.: 
                CartItems.push({
                    ISBN: $(this).closest('tr').find('td:eq(0)').text().trim(),
                    Title: $(this).closest('tr').find('td:eq(1)').text().trim(),
                });
                $(this).closest('tr').addClass("ExistingInCart");                
            }

            return false; //to prevent <a> from navigating to another address
        });





        $('.RemoveFromCART').click(function () {

            $(this).closest('tr').removeClass("ExistingInCart");

            var isbn = $(this).closest('tr').find('td:eq(0)').text().trim();
            CartItems = CartItems.filter(x => x.ISBN !== isbn);

            return false;
        });

一旦您需要提交或发布页面，您就会在 CartItems 数组中拥有所有已选择的书籍。

---

要将此 javascript 代码添加到您的视图中，请选择以下选项之一：

1. 将此块放在视图底部并将上述脚本复制到<script></script>标签内：

   @section 脚本{ <script> .... copy it here ... </script> }

2. 复制 newFile.js 中的脚本代码并将其添加到您的视图中

   <script src="~/Scripts/jquery-3.3.1.min.js"></script>

   <script src="~/Scripts/newFile.js"></script>

3. 您可能决定捆绑这个 newFile.js