用下拉击倒改变多个文本框

Changing multiple textboxes with dropdown knockout

本文关键字:文本 改变      更新时间:2023-09-26

我有以下HTML:

<select id="EmpName" data-bind="value: Employee.EmpName, event: { change: $root.updateEmployee }"></select>
<input disabled type="text" id="EmpNum" data-bind="value: Employee.EmpNum, valueUpdate: 'input'" />
<input disabled type="text" id="EmpClass" data-bind="value: Employee.EmpClass, valueUpdate: 'input'" />
<input disabled type="text" id="EmpDept" data-bind="value: Employee.EmpDept, valueUpdate: 'input' " />
<input disabled type="text" id="EmpStat" data-bind="value: Employee.EmpStat, valueUpdate: 'input'" />

它被以下ViewModel绑定:

generalViewModel = function (thisData) {
        var self = this;
        this.Incident = ko.mapping.fromJS(thisData.Incident);
        this.Employee = ko.mapping.fromJS(thisData.Employee);
        this.updateEmployee = function () {
            var employeeName = self.Employee.EmpName;
            $.getJSON('/Incidents/GetEmployee', { EmployeeName: employeeName }, function (data, status, xhr) {
                    var newEmp = ko.mapping.fromJS(data);
                    self.Employee(newEmp);
                });
        }
        this.refreshData = function (incID) {
            GetIncidentGeneralInfo(incID, node);
        }
        this.savetoServer = function (incID, buttonID) {
            var incident = ko.toJSON(self.Incident);
            var employee = ko.toJSON(self.Employee);
            $.post('/Incidents/SaveIncident', { IncidentID: incID, JSONIncident: incident, JSONEmployee: employee, button: buttonID }, function (data, status, xhr) {
                self.refreshData(data);
            });
        }
    }
    ko.applyBindings(new generalViewModel(data), document.getElementById(node));

除了updateEmployee函数之外,一切都运行得很好。JSON返回新的Employee信息,但是文本框没有更新。我做了一些愚蠢的错误,我不太明白

代替

var newEmp = ko.mapping.fromJS(data);
self.Employee(newEmp);

你应该做

ko.mapping.fromJS(data, self.Employee);

这将更新self.Employee上所有由第一次调用ko.mapping.fromJS创建的可观察属性