将参数从ajax函数传递到aspx.cs文件

Question

I have created some code in HTML, JS and AJAX, yet it does not work how I want it to.

<script type="text/javascript">
function DeleteSelectedRecord(id) {
            alert(id);
            $.ajax({
                type: "POST",
                url: "PrintTasks.aspx/DeleteRecord",
                data: '{"id":"' + id + '"}',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function () {
                    alert("Deleted!");
                },
                failure: function () {
                    alert("Failure!");
                }
            });

        }
    function CreateATableFromDataBase() {
        var deserializedData = '<%=serializedList %>';
            deserializedData = JSON.parse(deserializedData);
            for (var i = 0; i < deserializedData.length; i++) {
                document.write(
                    "<tr>" +
                    "<th scope=\"row\">" + i.toString() + "</th>" +
                    "<th>" + deserializedData[i]["Name"] + "</th>" +
                    "<th>" + deserializedData[i]["Where"] + "</th>" +
                    "<th>" + deserializedData[i]["Destination"] + "</th>" +
                    "<th><input type=\"button\" class=\"btn btn-primary\" onclick=\"DeleteSelectedRecord(" + deserializedData[i]["Id"] + ")\" value=\"Delete\"/></th>" +
                    "</tr>"
                );
            }
    }
</script>

The second function passes the argument "id" to the first one. I have used alert method so as to check, whether at least it works properly. It does. The problem starts when I want to pass the parameter to my super method called DeleteRecord in PrintTasks.aspx.cs file...

[System.Web.Services.WebMethod]
    public static void DeleteRecord(int id)
    {
        very sophisticated code...
    }

It is not important what is inside. The most curious thing is that it does not read my parameter.

Thank you!

Answer 1

Just change This Line of code. It will work

 data: '{"id":"' + id + '"}',

Change to

 data: { id:id},

First id is the parameter name you set in .cs file method.. and second one is value you are going to pass...

Answer 2

Try as mentioned below :

$.ajax({
                type: "POST",
                url: "PrintTasks.aspx/DeleteRecord?id=" + id,
                success: function () {
                    alert("Deleted!");
                },
                failure: function () {
                    alert("Failure!");
                }
            });

Or

 $.ajax({
                type: "POST",
                url: "PrintTasks.aspx/DeleteRecord",
                data: JSON.stringify({id:id}),
                contentType: "application/json;",
                dataType: "json",
                success: function () {
                    alert("Deleted!");
                },
                failure: function () {
                    alert("Failure!");
                }
            });

Answer 3

Use $.param() function for sending data to server. Here is the code:

       $.ajax({
           type: "POST",
            url: "PrintTasks.aspx/DeleteRecord",
            data: $.param({"id": id}),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function () {
                alert("Deleted!");
            },
            failure: function () {
                alert("Failure!");
            }
        });

Answer 4

Try by changing your ajax code
            $.ajax({
                type: "POST",
                url: "PrintTasks.aspx/DeleteRecord",
                data: '{"id":"' + ParseInt(id) + '"}',//change your code here
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function () {
                    alert("Deleted!");
                },
                failure: function () {
                    alert("Failure!");
                }
            });