如何将淘汰赛模型传递给j​​sonresult参数

时间:2017-11-06 01:54:25

标签: javascript asp.net-mvc razor knockout.js

我试图将整个对象传递给jsonresult方法。但是会发生错误。这可能是我限制它的方式,但我不确定。我是JS和KOJS的新手。一旦单击了绑定到LogUser方法的Login按钮,它就应该调用Authenticate(Employee p)方法。

这是我的班级模特

public class Employee
{
    [Key]
    public long AutoId { get; set; }

    [Required]
    Display(Name = "Employee ID")]
    public string EmployeeId { get; set; }

    [Required]
    [DataType(DataType.Password)]
    [Display(Name = "Password")]
    public string EmployeePassword { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public string MiddleName { get; set; }
}

这是我的knockoutjs视图模型

$(function () {
    ko.applyBindings(LoginVm);
});

//VIEW MODEL. MODEL IS BELOW THIS
var LoginVm = {

    thisEmp: ko.observable(EmpObject),

    LogUser: function () {
        var self = this;

        //trying to check if thisEmp properties has values by alerting
        alert("ID: " + thisEmp.EmployeeId() + " Password: " + thisEmp.EmployeePassword());

        $.ajax({
            url: '/Employee/AuthenticateUser',
            type: 'POST',
            dataType: 'json',
            data: ko.toJSON(thisEmp),
            contentType: 'application/json',
            success: function (errorMsg) {
                if (errorMsg === '') {

                }
            }
        });


    }
};

//MODEL
var EmpObject = {
    EmployeeId: ko.observable(''),
    EmployeePassword: ko.observable('')
}

这是我的观点以及我如何约束属性

@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)

    <fieldset>
        <legend>Employee</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.EmployeeId)
        </div>
        <div class="editor-field">
            @Html.TextBoxFor(model => model.EmployeeId, new { data_bind="value: thisEmp.EmployeeId()"})
            @Html.ValidationMessageFor(model => model.EmployeeId)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.EmployeePassword)
        </div>
        <div class="editor-field">
            @Html.PasswordFor(model => model.EmployeePassword, new { data_bind="value: thisEmp.EmployeePassword()"})
            @Html.ValidationMessageFor(model => model.EmployeePassword)
        </div>B

        <p>
            @*<input type="submit" value="Create"/>*@
            <input type="button" value="Login" data-bind="click: LogUser"/>
        </p>
    </fieldset>
}

这是错误

Uncaught TypeError: Unable to process binding "value: function (){return thisEmp().EmployeeId }"
Message: Cannot read property 'EmployeeId' of undefined
    at value (eval at createBindingsStringEvaluator

1 个答案:

答案 0 :(得分:1)

由于您在LoginVm之前定义了EmpObject,因此引发了错误。您需要更改声明的顺序。

您确定这是产生此错误的代码吗?在您的视图中,您正在绑定thisEmp.EmployeeId(),但错误表明它无法绑定thisEmp().EmployeeId。我认为你尝试过这两种方法并且错误仍然存​​在。无论哪种方式,都没有必要使thisEmp成为可观察的。这些属性是可观察的就足够了。

因此,请将您的代码更改为:

$(function () {
    ko.applyBindings(new LoginVm());
});

//MODEL
var EmpObject = {
    EmployeeId: ko.observable(''),
    EmployeePassword: ko.observable('')
}

//VIEW MODEL. MODEL IS BELOW THIS
var LoginVm = function() {
    var self = this;

    self.thisEmp = EmpObject;

    self.LogUser = function () {
        var self = this;

        //trying to check if thisEmp properties has values by alerting
        alert("ID: " + self.thisEmp.EmployeeId() + " Password: " + self.thisEmp.EmployeePassword());

        $.ajax({
            url: '/Employee/AuthenticateUser',
            type: 'POST',
            dataType: 'json',
            data: ko.toJSON(self.thisEmp),
            contentType: 'application/json',
            success: function (errorMsg) {
                if (errorMsg === '') {

                }
            }
        });
    }
};

并将视图中的绑定更改为:

@Html.TextBoxFor(model => model.EmployeeId, new { data_bind="value: thisEmp.EmployeeId"})
@Html.PasswordFor(model => model.EmployeePassword, new { data_bind="value: thisEmp.EmployeePassword"})