Search code examples
asp.netajaxformswebmethod

Use AJAX to submit data from HTML form to WebMethod


So I'm taking in data from an HTML form and then using AJAX to send the data to a web method to then be sent to a sqlite database, but my AJAX call is failing. What did I mess up? Am I doing it correctly?

HTML Form

<form id="addForm" >
     <input type="text"  name="playername" id="playername" placeholder="Player"/> 
     <input type="text" name="points" id="points" placeholder="Points" />
     <input type="text" name="steals" id="steals" placeholder="Steals" />
     <input type="text" name="blocks" id="blocks" placeholder="Blocks" /> 
     <input type="text" name="assists" id="assists" placeholder="Assists" />
     <input type="text" name="mpg" id="mpg" placeholder="MPG" /> 
     <input type="text" name="shotpct" id="shotpct" placeholder="Shot %" />
     <input type="text" name="threepct" id="3pct" placeholder="3 %" /> 
     <input type="button" value="add player" id="addbtn" name="addbtn" />
     </form>

AJAX

 $("#addbtn").click(function () {
                var form = $("#addForm").serializeArray();
                $.ajax({
                    type: 'POST',
                    url: "players.aspx/addRow",
                    data: JSON.stringify(form),
                    dataType: 'json',
                    success: function () {
                        alert('success');
                    },
                    error: function () {
                        alert('failure');
                    }
                });
                    });

and the web method(not finished, was just testing to see if I was getting data)

[WebMethod]
        public static void addRow(object form)
        {
            var stuff = form;
        }

I'm still learning how to use a lot of this stuff so any help will be greatly appreciated.


Solution

  • Replace

    type: 'POST',
    

    with

    method: 'POST',
    

    dataType: 'json' is not needed since you're not receiving data back. The data returned from the server, is formatted according to the dataType parameter.

    Also remove JSON.stringify(form),this is already done with the .serialize();