用服务器值填充下拉菜单

Populating dropdown menu with server values - knockout.js

本文关键字:下拉菜单 填充 服务器      更新时间:2023-09-26

我有一个基本的表单,允许用户添加尽可能多的课程。每门课程都必须属于一个课程。我决定在knockout.js框架之上构建它。我已经能够硬编码课程下拉菜单(self.curriculumList)的值。但我有困难从mysql数据库获取值填充下拉菜单。我该怎么做呢?JSFIDDLE

var initialData = [{
       courseName: ""
   }];/**/
   var CourseModel = function (courses) {
       var self = this;
       self.courses = ko.observableArray(ko.utils.arrayMap(courses, function (course) {
           return {
               courseName: course.courseName,
               selectedOptionValue : course.selectedOptionValue
           };
       }));

       self.curriculumList = $.getJSON('functions/getCurriculum.php', function(data) {
        data;
       });
       self.addCourse = function () {
           self.courses.push({
               courseName: "",
               selectedOptionValue : ko.observable("Select One")
           });
       };
       self.removeCourse = function (course) {
           self.courses.remove(course);
       };
       self.save = function() {
        self.lastSavedJson(JSON.stringify(ko.toJS(self.courses), null, 2));
       };

      self.lastSavedJson = ko.observable("");
   };
   ko.applyBindings(new CourseModel(initialData));

ajax调用是异步的,所以你需要在成功回调中访问数据并将其分配给可观察数组…

   self.curriculumList = ko.observableArray();
   $.getJSON('functions/getCurriculum.php', function(data) {
       self.curriculumList(data);
   });