I am try to get my onClick to work however my when I click nothing happens and no error to give insight as to what the problem might be

var data = new FormData();
            data.append("cart_list", new_cart);
            $.ajax({
            url: "@Url.Action("GetCart", "Home")",
                type: "POST",
            processData: false,
            contentType: false,
            data: data,
            success: function (result) {
                    //code after success
                    var html = "";
               // var removeIndex
                for (index = 0; index < result.result.length;   index) {
                         removeIndex = result.result[index]; 
                        html = html   '<li >'   result.result[index].HFR  ;
                      
                        Html = Html   ' <a  onclick="RemoveFromCart()"></a>';
                        html = html   '<i ></i>';
                        html = html   '</a>';
                        html = html   '<div >';
                        html = html   '<img src="../Content/assests/images/Catalogue/'   result.result[index].Foto   '" alt="../Content/assests/images/Catalogue/default.png">';
                        html = html   '</div>';
                        html = html   '<div >';
                        html = html   '<a  href="">'   result.result[index].TractorModel   " "   result.result[index].Description   '</a>';
                        html = html   '<span >'   result.result[index].HFR   '</span>';
                        html = html   '</div>';
                        html = html   '</li>';
                    }


                $("#myCart").html(html);
                },
            error: function (er) {

                    alert(er.responseText);
                }

            });

        }

        function RemoveFromCart()
        {
            alert("Remove me")
        }

CodePudding user response：

You may check if the onclick event is triggered correctly. For example, I have an asp.net core MVC project and it has integrated Jquery by default, in my code snippet, I have an alert clause for testing if it's triggered. Code snippet is in the default home page.

    @{
    ViewData["Title"] = "Home Page";
}

<div >
    <h1 >Welcome</h1>
    <p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>

<input id="picContent" type="file" name="photo" value="please upload a picture" />
<input id="btn1" type="button" value="upload"/>

@*@section scripts
{*@
<script>
    $("#btn1").click(function(){
        alert(1);
        return;
        var formData = new FormData();
        var img = $("#picContent")[0].files[0];
        console.log(img);
        console.log($("#picContent").val());
        formData.append("file", img);
        $.ajax({
            data: formData,
            url:"https://localhost:44340/home/upload",
            type:"post",
            data:formData,
            processData: false,
            contentType: false,
            success:function(data){
                alert(data);
            }
        })        
    })
</script>
@*}*@

CodePudding user response：

It is html not Html.

Replace this line :

 Html = Html   ' <a  onclick="RemoveFromCart()"></a>';

with

 html = html   ' <a  onclick="RemoveFromCart()"></a>';