如何在按钮点击上添加一行？

Question

在此fiddle中有一个添加计时按钮。有默认行有工作日下拉列表，从时间文本字段到时间文本字段和医院下拉。现在，当我点击添加计时按钮时，我想要另一行有工作日下拉列表，从时间文本字段到时间文本字段和医院下拉列表。

任何人都可以告诉我该怎么做吗？

这是我的淘汰代码

var DocSchedule = function (id, day, fromtime, totime, hospital, hospitalId) {
    this.id = ko.observable(id);
    this.day = ko.observable(day);
    this.fromtime = ko.observable(fromtime);
    this.totime = ko.observable(totime);
    this.hospital = ko.observable(hospital);
    this.hospitalId = ko.observable(hospitalId);
};

var Patientp = function () {
    this.id = ko.observable(idValue);
    this.name = ko.observable(nameValue);
    this.degree = ko.observable(degreeValue);
    this.gender = ko.observable(genderValue);
    //this.consultant= ko.observableArray(consultantArrValue);
    this.username = ko.observable(usernameValue);
    this.password = ko.observable(passwordValue);
    this.email = ko.observable(emailValue);
    this.mobile = ko.observable(mobileValue);
    this.imgFile = ko.observable(imgFileValue);
    this.imgSrc = ko.observable(imgSrcValue);
    this.imagePath = ko.observable(imagePathValue);
    this.userid = ko.observable(useridValue);
    this.department = ko.observable(departmentValue);
    //this.consultant= ko.observableArray(consultantArrValue);
    //this.consultant= ko.observable(consultantValue);
    this.addSlot = function (doctor) {


        var docSchedule = new DocSchedule();
        iter = iter + 1;
        docSchedule.id(iter);

    }


}
idValue = 'hi';
useridValue = 'hi';
nameValue = 'hi';
addressValue = 'adress';
genderValue = 'hi';
mobileValue = 'hi';
//these fields are not available
usernameValue = 'hi';
passwordValue = 'hi';
emailValue = 'hi';
imgFileValue = 'imagefileValue';
imgSrcValue = 'ui_resources/img/profile_pic.png';
imagePathValue = 'imagePathValue';
consultantArrValue = null; //'${currentpatient.user.name}';
consultantValue = "d1";
degreeValue = 'hi';
departmentValue = 'hi';



var iter = 0;
var patp = new Patientp();
ko.applyBindings(patp);

Answer 1

1. observableArray Patientp您没有doctor.schedules.push(docSchedule);个时间表 抛出未捕获的TypeError：无法读取未定义的属性＆＃39;

试试这个：

var iter = 0;
var DocSchedule = function (id, day, fromtime, totime, hospital, hospitalId) {
    this.id = ko.observable(id);
    this.day = ko.observable(day);
    this.fromtime = ko.observable(fromtime);
    this.totime = ko.observable(totime);
    this.hospital = ko.observable(hospital);
    this.hospitalId = ko.observable(hospitalId);
};

var Patientp = function () {
    this.id = ko.observable(idValue);
    this.name = ko.observable(nameValue);
    this.degree = ko.observable(degreeValue);
    this.gender = ko.observable(genderValue);
    this.username = ko.observable(usernameValue);
    this.password = ko.observable(passwordValue);
    this.email = ko.observable(emailValue);
    this.mobile = ko.observable(mobileValue);
    this.imgFile = ko.observable(imgFileValue);
    this.imgSrc = ko.observable(imgSrcValue);
    this.imagePath = ko.observable(imagePathValue);
    this.userid = ko.observable(useridValue);
    this.department = ko.observable(departmentValue);
    this.schedulers = ko.observableArray([]);
}
idValue = 'hi';
useridValue = 'hi';
nameValue = 'hi';
addressValue = 'adress';
genderValue = 'hi';
mobileValue = 'hi';
usernameValue = 'hi';
passwordValue = 'hi';
emailValue = 'hi';
imgFileValue = 'imagefileValue';
imgSrcValue = 'ui_resources/img/profile_pic.png';
imagePathValue = 'imagePathValue';
consultantArrValue = null;
consultantValue = "d1";
degreeValue = 'hi';
departmentValue = 'hi';

function vm() {
    var self = this;
    self.person = new Patientp();
    self.schedule = new DocSchedule();
    self.schedules = ko.observableArray([new DocSchedule(iter)]);

    self.addSlot = function () {
        console.log('added');
        iter++;
        var docSchedule = new DocSchedule(iter);
        self.schedules.push(docSchedule);
    };

    self.removeSlot = function () {
        console.log('removed');
        self.schedules.remove(this);
    }
};
var viewModel = new vm();
ko.applyBindings(viewModel, document.getElementById('addDoctorSchedules'));

以下是 Demo