codebehind webmethod is not called using jquery ajax with knockout I tried a lot of things but failed

Question

I have tried all the things, friendly url resolve, on webmethod enable session etc but it is not solved by any means. kindly solve my this issue. Here is my Html code for inserting and deleting Employees

<table>
            <thead>
                <th>Employee ID</th>
                <th>Employee Name</th>
                <th>Employee Salary</th>
            </thead>
            <tbody style="color:white" data-bind="foreach:Employees">
                <tr>
                    <td> <span data-bind="text: ID"></span> </td>
                    <td> <span data-bind="text: Name"></span></td>
                    <td> <span data-bind="text: Salary"></span></td>
                    <td> <button type="button" data-bind="click: $parent.DeleteRecord"> Delete</button></td>
                </tr>
            </tbody>
        </table>
        <hr />
    </div>
       <h2> Add New Employee</h2>
    <div style="background-color:wheat">
        <table>
            <tr>
                <td>Employee ID:</td>
                <td><input type="text" data-bind="value:ID" /></td>
                <td><span data-bind="text: ID"></span></td>
                </tr>
            <tr>
                <td>Employee Name:</td>
                <td><input type="text" data-bind="value: Name" /></td>
                 <td><span data-bind="text: Name"></span></td>
                </tr>
            <tr>
                <td>Employee Salary:</td>
                <td><input type="text" data-bind="value:Salary"/></td>
                 <td><span data-bind="text: Salary"></span></td>
                </tr>
          <tr>
<%--              <td><button type="submit" data-bind="click:$root.checkfunc">Check</button></td>--%>
              <td><button type="submit" data-bind="click:insert"> Add Employee </button></td>

          </tr>
       </table>
</div>

Here is my script with Jquery with knockout and ajax:

 <script>
        function Employee(emp)
        {
            this.ID= ko.observable(emp.ID)
            this.Name = ko.observable(emp.Name);
            this.Salary = ko.observable(emp.Salary);
        }
        function employeeviewModel() {
            var self = this;
            self.ID = ko.observable();
            self.Name = ko.observable();
            self.Salary = ko.observable();
            self.Employees = ko.observableArray();

            self.insert = function () {
                var jsondata = Employee({ ID: self.ID(), Name: self.Name(), Salary: self.Salary() });

                $.ajax({
                    type: "POST",
                    url: "Testing.aspx/insertEmployee",
                    contentType: "application/json; charset=utf-8",
                    dataType:"json",
                    data: '{employee: ' + JSON.stringify(jsondata) + '}',
                    success: function (data) {
                        self.Employees.push(new Employee({ ID: self.ID(), Name: self.Name(), Salary: self.Salary() }));
                        alert(data.d);
                    },
                    error: function (data) {
                        alert(data);
                    }
                });
             };

             self.DeleteRecord = function (data) {
                 self.Employees.remove(data);
             };
        }
        $(document).ready(function () {
            var mymodel = new employeeviewModel();
            ko.applyBindings(mymodel);
        });

    </script>

Here is My CodeBehind Code:

[WebMethod]
public static Employee insertEmployee(Employee data)
{
    EmployeeRepository repository = new EmployeeRepository();
    repository.Add(data);
    return data;
}
[WebMethod]
public static void deletenow(int id)
{
    EmployeeRepository repository = new EmployeeRepository();
    repository.delete(id);
}

Answer 1

Just pass parameters like this, this solved my issue. if you will not provide parameters with the correct format, the web method will not be called.

data: JSON.stringify({'employee': jsondata})

Answer 2

I think it doesn't like the mismatch between the name you gave the object in the JSON and the parameter name in the web method. See if this does it:

$.ajax({
    ...
   data: '{data: ' + JSON.stringify(jsondata) + '}',
   ...                    
});