在 jquery 对话框中保留旧页面的敲除分页取消并打开
knockout paging retaining old page on jquery dialog cancel and open
我在敲除分页时遇到问题。我在 jquery 上使用敲除分页 dialog.The 问题是当我从第 1 页导航到第 2 页、第 3 页或第 4 页并关闭对话框并打开对话框时我再次看到我最后关闭但不是从第一页关闭的页面。附上 jsfiddle below.Please 如果您有任何问题,请告诉我。
http://jsfiddle.net/bharatgillala/yuvNt/57/
var data = [
{Player:"PAGE1", runs:"34889"},
{Player:"PAGE1", runs:"83366"},
{Player:"PAGE1", runs:"52534"},
{Player:"PAGE2", runs:"02232"},
{Player:"PAGE2", runs:"55899"},
{Player:"PAGE2", runs:"90483"},
{Player:"PAGE3", runs:"02565"},
{Player:"PAGE3", runs:"98500"},
{Player:"PAGE3", runs:"20285"},
{Player:"PAGE4", runs:"57757"},
];
var StaticDataExample1 = function(data){
// stuff I care about
this.items = ko.observableArray(data);
// pager related stuff
------------------------------
this.currentPage = ko.observable(1);
this.perPage = 3;
this.pagedItems = ko.computed(function(){
var pg = this.currentPage(),
start = this.perPage * (pg-1),
end = start + this.perPage;
return this.items().slice(start,end);
}, this);
this.nextPage = function(){
if(this.nextPageEnabled())
this.currentPage(this.currentPage()+1);
};
this.nextPageEnabled = ko.computed(function(){
return this.items().length > this.perPage * this.currentPage();
},this);
this.previousPage = function(){
if(this.previousPageEnabled())
this.currentPage(this.currentPage()-1);
};
this.previousPageEnabled = ko.computed(function(){
return this.currentPage() > 1;
},this);
};
ko.applyBindings(new StaticDataExample1(data),document.getElementById("test"));
$(document).on("click", "[id*=atest]", function ()
{
$("#test" ).dialog(
{
height: 420,
width: 430,
modal: true,
buttons: [
{
text: "Save",
},
{
text: "Cancel",
tabIndex: -1,
click: function () {
$(this).dialog("close");
}
}
],
close: function () { }
});
});
实际上你快到了。
将您的 ko.applyBindings 更改为:
var model = new StaticDataExample1(data);
ko.applyBindings(model, document.getElementById("test"));
然后在 close:
选项之后的 $(...).dialog({ ... })
选项中添加一个 open:
函数:
close: function () {
},
open: function () {
model.currentPage(1);
}
Fiddle 这里:http://jsfiddle.net/yuvNt/63/
我刚才想到了;如果您不想添加 open:
函数,您甚至可以将 model.currentPage(1);
调用添加到现有的 close:
函数中。
希望有用。
我在敲除分页时遇到问题。我在 jquery 上使用敲除分页 dialog.The 问题是当我从第 1 页导航到第 2 页、第 3 页或第 4 页并关闭对话框并打开对话框时我再次看到我最后关闭但不是从第一页关闭的页面。附上 jsfiddle below.Please 如果您有任何问题,请告诉我。
http://jsfiddle.net/bharatgillala/yuvNt/57/
var data = [
{Player:"PAGE1", runs:"34889"},
{Player:"PAGE1", runs:"83366"},
{Player:"PAGE1", runs:"52534"},
{Player:"PAGE2", runs:"02232"},
{Player:"PAGE2", runs:"55899"},
{Player:"PAGE2", runs:"90483"},
{Player:"PAGE3", runs:"02565"},
{Player:"PAGE3", runs:"98500"},
{Player:"PAGE3", runs:"20285"},
{Player:"PAGE4", runs:"57757"},
];
var StaticDataExample1 = function(data){
// stuff I care about
this.items = ko.observableArray(data);
// pager related stuff
------------------------------
this.currentPage = ko.observable(1);
this.perPage = 3;
this.pagedItems = ko.computed(function(){
var pg = this.currentPage(),
start = this.perPage * (pg-1),
end = start + this.perPage;
return this.items().slice(start,end);
}, this);
this.nextPage = function(){
if(this.nextPageEnabled())
this.currentPage(this.currentPage()+1);
};
this.nextPageEnabled = ko.computed(function(){
return this.items().length > this.perPage * this.currentPage();
},this);
this.previousPage = function(){
if(this.previousPageEnabled())
this.currentPage(this.currentPage()-1);
};
this.previousPageEnabled = ko.computed(function(){
return this.currentPage() > 1;
},this);
};
ko.applyBindings(new StaticDataExample1(data),document.getElementById("test"));
$(document).on("click", "[id*=atest]", function ()
{
$("#test" ).dialog(
{
height: 420,
width: 430,
modal: true,
buttons: [
{
text: "Save",
},
{
text: "Cancel",
tabIndex: -1,
click: function () {
$(this).dialog("close");
}
}
],
close: function () { }
});
});
实际上你快到了。
将您的 ko.applyBindings 更改为:
var model = new StaticDataExample1(data);
ko.applyBindings(model, document.getElementById("test"));
然后在 close:
选项之后的 $(...).dialog({ ... })
选项中添加一个 open:
函数:
close: function () {
},
open: function () {
model.currentPage(1);
}
Fiddle 这里:http://jsfiddle.net/yuvNt/63/
我刚才想到了;如果您不想添加 open:
函数,您甚至可以将 model.currentPage(1);
调用添加到现有的 close:
函数中。
希望有用。