How can I get some data from jQuery and call Html.ActionLink with it

Question

I have hidden Html.ActionLink, where "Delete" - Action name, "Students" - controller name:

@Html.ActionLink("Delete student", "Delete", "Students", new { id = "" }, new { @id = "DeleteButton", @style = "visibility:hidden;" })

And jQuery code:

<script type="text/javascript">
    $(document).ready(function () {
        var table = $('#students_table').DataTable();

        $('#btnDelete').click(function () {
            var studentId = table.row('.selected')[0]; //this give me correct id
            //alert(studentId); 
            if (studentId) {
                var href = "?id=" + studentId;
                //$("#DeleteButton").attr(href).click();
                //$('#DeleteButton').attr("?id=" + encodeURIComponent(studentId)).click();
            }
            table.row('.selected').remove().draw(false);
        });

    });
</script>

My problem in calling ActionLink with Id which I got ( $("#DeleteButton").attr(href).click(); )

PS #btnDelete - this is id for simple button in html

Answer 1

Do the delete with ajax:

<script type="text/javascript">
    $(document).ready(function () {
        var table = $('#students_table').DataTable();

        $('#DeleteButton').click(function (event) {
            event.preventDefault();

            var studentId = table.row('.selected')[0]; //this give me correct id
            //alert(studentId); 
            if (studentId) {
                $.get( "URL_TO_BACKEND?id=" + studentId, function() {
                    table.row('.selected').remove().draw(false);
                });
            }
        });
    });
</script>

http://api.jquery.com/jQuery.get/