使用JQuery在表中动态添加行时,将添加Undefined

时间:2016-11-30 04:33:00

标签: javascript jquery asp.net-web-api undefined

当我使用jquery而不是动态插入的数据动态地在表中添加行时,在表行中添加了undefined。

enter image description here 这是表单,当我添加数据时,而不是添加未定义的数据。

var employee = {
        ID: 0,
        Name: "",
        LastName: ""
    };

    function addEmployee(employee)
    {
        debugger;
        alert(employee.ID);
        $.ajax({
            url: "http://localhost:51640/employee/createemployee",
            type: 'POST',
            contentType:
               "application/json;charset=utf-8",
            data: JSON.stringify(employee),
            success: function (employee) {                    
                employeeAddSuccess(employee);
            },                           
        });
    }



    function employeeAddSuccess(employee) {
        alert(employee.Name);           
        employeeAddRow(employee);            
        alert("about to clear ");
        formClear();
        alert("successfully addded");
    }

    function employeeAddRow(employee) {
        alert(employee.ID);
        $("#employeeTable tbody").append(employeeBuildTableRow(employee));
    }
    function formClear() {
        $("#lblempID").val("");
        $("#lblEmpName").val("");
        $("#lblEmpLastName").val("");
    }
    function addClick() {
        formClear();
    }

    function employeeBuildTableRow(employee) {
        debugger;
        var ret =
          "<tr>" +
           "<td>" + employee.ID + "</td>" +
           "<td>" + employee.Name + "</td>"
            + "<td>" + employee.LastName + "</td>" +
          "</tr>";
        alert(ret);
        return ret;
    }


    function updateClick() {
        // Build product object from inputs
        employee = new Object();
        employee.ID = $('#lblempID').val();
        employee.Name = $('#lblEmpName').val();
        employee.LastName = $('#lblEmpLastName').val();
        addEmployee(employee);           
    }

1 个答案:

答案 0 :(得分:0)

您不应该对要发送的数据进行字符串化,请尝试:

function addEmployee(employee)
    {
        debugger;
        console.log(employee);  // verify the data that will be sent to the server
        $.ajax({
            url: "http://localhost:51640/employee/createemployee",
            type: 'POST',
            dataType:'json'
            contentType:
               "application/json;charset=utf-8",
            data: employee,
            success: function (result) {
                console.log(result); // verify the result coming back                  
                employeeAddSuccess(result);
            },
            fail: function (error) {
                console.log(error); // if there's an error, log that too
            }
        });
}

您还应记录服务器收到数据时发生的情况,可能是“未定义”发生的地方。

我假设您还需要错误处理服务器端,以便在您的ajax调用的fail回调中获得有意义的结果。上面的代码可以帮助您标记问题的来源。

最后,为了爱一切代码,不要使用警报进行调试! console.log同样适用,不会阻止你的应用程序/惹恼所有参与者的地狱:)