ASP.NET : Update Data using jQuery JavaScript via WebService

This sample will show how to Update Data using jQuery JavaScript via WebService.

Step 1 : Create WebService Method.

    [WebMethod]
    public string UpdateData(string Data)
    {
        //Connect DataBase to Update Data
        return "Update '" + Data + "' successfully.";
    }

Step 2 : Create JavaScript function using jQuery.ajax

    function UpdateData() {
        $.ajax({
            url: "WebService.asmx/UpdateData",
            data: "{ 'Data': '" + $("#txtData").val() + "' }",
            dataType: "json",
            type: "POST",
            contentType: "application/json; charset=utf-8",
            dataFilter: function (data) { return data; },
            success: function (data) {
                alert(data.d);
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert(XMLHttpRequest.responseText);
            }
        });
    }

Step 3 : Call it from Button OnClientClick.

        <asp:TextBox ID="txtData" runat="server" ></asp:TextBox>

        <br />

        <asp:Button ID="btnUpdate" runat="server" Text="UpdateData" OnClientClick="UpdateData();return false;" />

enjoy ZomDev