我在我的django项目中使用knockout.js并且在javascript中的post方法有问题。我试图重新绑定或重新初始化列表,但它没有用。
例如:我正在显示包含10行的表格数据。我希望点击按钮我得到另外5行的数据,并希望在不重新加载页面的情况下在表格上重新加载该数据。
有没有人知道解决方案..下面是我的knockout.js,html和view.py页面的代码:
的javascript:
function makeShowObjectList(model, d_url, no_num, detail_per_page, b, fruit) {
var showobjectList = ko.observableArray([]);
$.post(d_url, data, function (response_data) {
// here we have applied code to set new data in showobjectList
if (!showobjectList.is_ready)
{
//Here we are trying to relaod the list on the page but did'nt work
FViewModel.showobjectList=showobjectList;
showobjectList.is_ready = true;
showobjectList.onready();
ko.mapping.fromJSshowobjectList, {}, self); }
}
}, 'json');
}
function fruitFilterItem( n, i ) {
this.n = n;
this.i = i;
}
var FViewModel=function(c_data)
{
var self = this;
self.abc= ko.observable(null);
this.optionsText = ko.observable();
this.fruitFilter = ko.observableArray([
new fruitFilterItem( "Mango", 2 ),
new fruitFilterItem( "Banana", 1 ),
new fruitFilterItem( "Grapes", 3 )
]);
this.selectedfruit = ko.observable();
this.VegeFilter = ko.observableArray([
new fruitFilterItem( "Tomato", "Tomato" ),
new fruitFilterItem( "Patato", "Patato" ),
new fruitFilterItem( "Onion", "Onion" ),
]);
this.selectedVege = ko.observable();
self.showtList = makeShowObjectList(BucketViewModel, urls.get_fruit_info, self.fruit_page, self.num_fruit, self.bbq,
self.selectedfruit());
self.setShowType = function(d, ele) {
this.get_updates = function () {
ko.mapping.fromJS(searchList(), self);};
self.showtList = makeShowObjectList(BucketViewModel, urls.get_fruit_info, self.fruit_page, self.num_fruit, self.b, self.selectedfruit());
self.showtList();
}
self.ShowmessageList = function () {
return self.showtList;
}
}
HTML:
<script>
VarModel = new FViewModel(c_data);
$(function() {
function get_updates () {
$.getJSON('/new-lines.json', function(c_data) {
var VarModel = ko.mapping.fromJS(choices_data);
ko.applyBindings(VarModel );
});
} ko.applyBindings(VarModel);
</script>
<body>
<select id="fruit" name="fruit" style="width:200px;" data-bind = "
value: selectedfruit,
options: fruitFilter,
optionsText: 'n',
optionsValue: 'i',
optionsCaption: 'Select a fruit'
">
</select>
<select style="width:180px;" data-bind = "
value: selectedVege,
options: VegeFilter,
optionsText: 'n',
optionsValue: 'i',
optionsCaption: 'Select a Vege'
">
//这里我们正在展示我们的专栏
</body>
Views.py:
def urls.get_fruit_info(request):
//we are calculating the page_object here
response_object = {
'page': page_object,
'no_not': FruitRecipient.objects.filter(user=request.member, add_at=None).count()
}
return HttpResponse(simplejson.dumps(response_object, indent=3))
如果有人帮我解决问题,我将感激不尽。 提前谢谢。
答案 0 :(得分:0)
使用ko.mapping它可以下载的插件,它只更新两个状态之间已更改的可观察对象,因此只有已更改的成员才会在视图中重新呈现