使用Json数据和Knockout JS Viewmodel填充bootstrap选择 [英] Populate bootstrap select with Json data And Knockout JS Viewmodel
问题描述
我在项目中使用JSON和bootstrap控件。在我的JSON中，我从我的sql数据库中检索数据。现在我想用我的数据填充我的选择控件，但它不起作用，我看不出我做错了什么，我已经搜索了很多小提琴来让它工作。
这是我的JSON：
var Projectss = function（data）{
var self = this ;
self.ProjectName = ko.observable（data.ProjectName）;
}
var ProjectModel =功能（项目）{
var self = this;
self.Projects = ko.observableArray（Projects）;
$ .ajax（{
url：CreateTask.aspx / GetProjectList，
//当前页面，方法
数据： ''{}''，
//参数图为JSON
类型：POST，
//数据必须张贴
contentType：application / json; charset = utf-8，
//张贴J SON内容
dataType：JSON，
//数据类型是JSON（必须大写！）
超时：10000，
// AJAX超时
成功：功能（结果）{
var MappedProjects =
$ .map（ Result.d，
function（item）{return new Projectss（item）; }）;
self.Projects（MappedProjects）;
}，
错误：函数（xhr，status）{
提醒（状态+ - + xhr.responseText）;
}
}）;
};
$（文件）.ready（function（）{
var VM = new ProjectModel（）;
ko.applyBindings（VM）;
}）
这是我试图填充我的选择的地方，这个在我的td里面
I am using JSON and bootstrap controls in my project. In my JSON I retrieve data from my sql database. Now I want to populate my select control with my data but it doesn''t work, I can''t see what I am doing wrong and I have searched lots of fiddles to get it to work.
This is my JSON :
var Projectss = function (data) {
var self = this;
self.ProjectName = ko.observable(data.ProjectName);
}
var ProjectModel = function (Projects) {
var self = this;
self.Projects = ko.observableArray(Projects);
$.ajax({
url: "CreateTask.aspx/GetProjectList",
// Current Page, Method
data: ''{}'',
// parameter map as JSON
type: "POST",
// data has to be POSTed
contentType: "application/json; charset=utf-8",
// posting JSON content
dataType: "JSON",
// type of data is JSON (must be upper case!)
timeout: 10000,
// AJAX timeout
success: function (Result) {
var MappedProjects =
$.map(Result.d,
function (item) { return new Projectss(item); });
self.Projects(MappedProjects);
},
error: function (xhr, status) {
alert(status + " - " + xhr.responseText);
}
});
};
$(document).ready(function () {
var VM = new ProjectModel();
ko.applyBindings(VM);
})
This is where I am trying to populate my select, this is inside of my td
<div data-bind="foreach: Projects">
<select data-bind="options: $root.MappedProjects, optionsText: ProjectName, value: 'ProjectName'">
</select>
</div>
我用Json数据创建了一个jsfiddle jsfiddle.net/Fumunchu/N7J2E但是它仍然不起作用。
I have created a jsfiddle jsfiddle.net/Fumunchu/N7J2E with the Json data but it still does not work.
推荐答案
.ajax（{
url：CreateTask.aspx / GetProjectList，
//当前页面，方法
数据：''{}''，
//参数图为JSON
类型： POST，
//数据必须张贴
contentType：application / json; charset = utf-8，
//发布JSON内容
dataType：JSON，
//数据类型是JSON（必须大写！）
超时：10000 ，
// AJAX超时
成功：功能（结果）{
var MappedProjects =
.ajax({
url: "CreateTask.aspx/GetProjectList",
// Current Page, Method
data: ''{}'',
// parameter map as JSON
type: "POST",
// data has to be POSTed
contentType: "application/json; charset=utf-8",
// posting JSON content
dataType: "JSON",
// type of data is JSON (must be upper case!)
timeout: 10000,
// AJAX timeout
success: function (Result) {
var MappedProjects =
.map（Result.d，
函数（项目）{return new Projectss（item）; }）;
self.Projects（MappedProjects）;
}，
错误：函数（xhr，status）{
提醒（状态+ - + xhr.responseText）;
}
}）;
};
.map(Result.d,
function (item) { return new Projectss(item); });
self.Projects(MappedProjects);
},
error: function (xhr, status) {
alert(status + " - " + xhr.responseText);
}
});
};
（document）.ready（function（）{
var VM = new ProjectModel （）;
ko.applyBindings（VM）;
}）
这是我在尝试的地方填充我的选择，这是我的td
(document).ready(function () {
var VM = new ProjectModel();
ko.applyBindings(VM);
})
This is where I am trying to populate my select, this is inside of my td
<div data-bind="foreach: Projects">
<select data-bind="options:
这篇关于使用Json数据和Knockout JS Viewmodel填充bootstrap选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
