mirror of https://github.com/apache/cloudstack.git
pagination - implement previous button, next button.
This commit is contained in:
parent
677394c27a
commit
0ad7680dfd
|
|
@ -30,20 +30,76 @@ function afterLoadClusterJSP($leftmenuItem1) {
|
|||
clusterJsonToRightPanel($leftmenuItem1);
|
||||
var clusterId = $leftmenuItem1.data("jsonObj").id;
|
||||
var $midmenuContainer = $("#midmenu_container").empty();
|
||||
|
||||
disableMultipleSelectionInMidMenu();
|
||||
|
||||
var $container_host = $("<div id='midmenu_host_container'></div>");
|
||||
$midmenuContainer.append($container_host);
|
||||
var $header1 = $("#midmenu_itemheader_without_margin").clone().show(); //without margin on top
|
||||
$header1.find("#name").text("Host");
|
||||
$container_host.append($header1);
|
||||
listMidMenuItems2(("listHosts&type=Routing&clusterid="+clusterId), "listhostsresponse", "host", hostToMidmenu, hostToRightPanel, hostGetMidmenuId, false, true, $container_host);
|
||||
$container_host.append($header1);
|
||||
//listMidMenuItems2(("listHosts&type=Routing&clusterid="+clusterId), "listhostsresponse", "host", hostToMidmenu, hostToRightPanel, hostGetMidmenuId, false, 1);
|
||||
var count = 0;
|
||||
$.ajax({
|
||||
cache: false,
|
||||
data: createURL("command=listHosts&type=Routing&clusterid="+clusterId),
|
||||
dataType: "json",
|
||||
async: false,
|
||||
success: function(json) {
|
||||
selectedItemsInMidMenu = {};
|
||||
var items = json.listhostsresponse.host;
|
||||
if(items != null && items.length > 0) {
|
||||
for(var i=0; i<items.length;i++) {
|
||||
var $midmenuItem1 = $("#midmenu_item").clone();
|
||||
$midmenuItem1.data("toRightPanelFn", hostToRightPanel);
|
||||
hostToMidmenu(items[i], $midmenuItem1);
|
||||
bindClickToMidMenu($midmenuItem1, hostToRightPanel, hostGetMidmenuId);
|
||||
|
||||
$container_host.append($midmenuItem1.show());
|
||||
if(i == 0) { //click the 1st item in middle menu as default
|
||||
$midmenuItem1.click();
|
||||
}
|
||||
}
|
||||
count = items.length;
|
||||
}
|
||||
else {
|
||||
$container_host.append($("#midmenu_container_no_items_available").clone().show());
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
|
||||
var $container_primarystorage = $("<div id='midmenu_primarystorage_container'></div>");
|
||||
$midmenuContainer.append($container_primarystorage);
|
||||
var $header2 = $("#midmenu_itemheader_with_margin").clone().show(); //with margin on top
|
||||
$header2.find("#name").text("Primary Storage");
|
||||
$container_primarystorage.append($header2);
|
||||
listMidMenuItems2(("listStoragePools&clusterid="+clusterId), "liststoragepoolsresponse", "storagepool", primarystorageToMidmenu, primarystorageToRightPanel, primarystorageGetMidmenuId, false, false, $container_primarystorage);
|
||||
//listMidMenuItems2(("listStoragePools&clusterid="+clusterId), "liststoragepoolsresponse", "storagepool", primarystorageToMidmenu, primarystorageToRightPanel, primarystorageGetMidmenuId, false, 1);
|
||||
var count = 0;
|
||||
$.ajax({
|
||||
cache: false,
|
||||
data: createURL("command=listStoragePools&clusterid="+clusterId),
|
||||
dataType: "json",
|
||||
async: false,
|
||||
success: function(json) {
|
||||
selectedItemsInMidMenu = {};
|
||||
var items = json.liststoragepoolsresponse.storagepool;
|
||||
if(items != null && items.length > 0) {
|
||||
for(var i=0; i<items.length;i++) {
|
||||
var $midmenuItem1 = $("#midmenu_item").clone();
|
||||
$midmenuItem1.data("toRightPanelFn", primarystorageToRightPanel);
|
||||
primarystorageToMidmenu(items[i], $midmenuItem1);
|
||||
bindClickToMidMenu($midmenuItem1, primarystorageToRightPanel, primarystorageGetMidmenuId);
|
||||
$container_primarystorage.append($midmenuItem1.show());
|
||||
}
|
||||
count = items.length;
|
||||
}
|
||||
else {
|
||||
$container_primarystorage.append($("#midmenu_container_no_items_available").clone().show());
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function clusterJsonToRightPanel($leftmenuItem1) {
|
||||
|
|
|
|||
|
|
@ -210,8 +210,25 @@ $(document).ready(function() {
|
|||
return;
|
||||
}
|
||||
|
||||
//pagination
|
||||
$("#middle_menu_pagination").unbind("clik").bind("click", function(event) {
|
||||
var params = $(this).data("params");
|
||||
|
||||
var $target = $(event.target);
|
||||
var targetId = $target.attr("id");
|
||||
|
||||
if(targetId == "midmenu_prevbutton") {
|
||||
listMidMenuItems2(params.commandString, params.jsonResponse1, params.jsonResponse2, params.toMidmenuFn, params.toRightPanelFn, params.getMidmenuIdFn, params.isMultipleSelectionInMidMenu, (params.page-1));
|
||||
}
|
||||
else if(targetId == "midmenu_nextbutton") {
|
||||
listMidMenuItems2(params.commandString, params.jsonResponse1, params.jsonResponse2, params.toMidmenuFn, params.toRightPanelFn, params.getMidmenuIdFn, params.isMultipleSelectionInMidMenu, (params.page+1));
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
|
||||
// refresh button
|
||||
$("#refresh_link").bind("click", function(event) {
|
||||
$("#refresh_link").unbind("clik").bind("click", function(event) {
|
||||
var onRefreshFn = $("#right_panel").data("onRefreshFn");
|
||||
if(onRefreshFn != null)
|
||||
onRefreshFn();
|
||||
|
|
@ -219,13 +236,13 @@ $(document).ready(function() {
|
|||
});
|
||||
|
||||
// Initialize help drop down dialog
|
||||
$("#help_link").bind("click", function(event) {
|
||||
$("#help_link").unbind("clik").bind("click", function(event) {
|
||||
$("#help_dropdown_dialog").show();
|
||||
$("#help_button").addClass("selected");
|
||||
return false;
|
||||
});
|
||||
|
||||
$("#help_dropdown_close").bind("click", function(event) {
|
||||
$("#help_dropdown_close").unbind("clik").bind("click", function(event) {
|
||||
$("#help_dropdown_dialog").hide();
|
||||
$("#help_button").removeClass("selected");
|
||||
return false;
|
||||
|
|
|
|||
|
|
@ -928,7 +928,19 @@ function getMidmenuId(jsonObj) {
|
|||
return "midmenuItem_" + jsonObj.id;
|
||||
}
|
||||
|
||||
function listMidMenuItems2(commandString, jsonResponse1, jsonResponse2, toMidmenuFn, toRightPanelFn, getMidmenuIdFn, isMultipleSelectionInMidMenu, clickFirstItem, $midMenuContainer) {
|
||||
function listMidMenuItems2(commandString, jsonResponse1, jsonResponse2, toMidmenuFn, toRightPanelFn, getMidmenuIdFn, isMultipleSelectionInMidMenu, page) {
|
||||
var params = {
|
||||
"commandString": commandString,
|
||||
"jsonResponse1": jsonResponse1,
|
||||
"jsonResponse2": jsonResponse2,
|
||||
"toMidmenuFn": toMidmenuFn,
|
||||
"toRightPanelFn": toRightPanelFn,
|
||||
"getMidmenuIdFn": getMidmenuIdFn,
|
||||
"isMultipleSelectionInMidMenu": isMultipleSelectionInMidMenu,
|
||||
"page": page
|
||||
}
|
||||
$("#middle_menu_pagination").data("params", params);
|
||||
|
||||
if(isMultipleSelectionInMidMenu == true)
|
||||
enableMultipleSelectionInMidMenu();
|
||||
else
|
||||
|
|
@ -937,11 +949,12 @@ function listMidMenuItems2(commandString, jsonResponse1, jsonResponse2, toMidmen
|
|||
var count = 0;
|
||||
$.ajax({
|
||||
cache: false,
|
||||
data: createURL("command="+commandString+"&pagesize="+midmenuItemCount+"&page=1"),
|
||||
data: createURL("command="+commandString+"&pagesize="+midmenuItemCount+"&page="+page),
|
||||
dataType: "json",
|
||||
async: false,
|
||||
success: function(json) {
|
||||
selectedItemsInMidMenu = {};
|
||||
success: function(json) {
|
||||
selectedItemsInMidMenu = {};
|
||||
$("#midmenu_container").empty();
|
||||
var items = json[jsonResponse1][jsonResponse2];
|
||||
if(items != null && items.length > 0) {
|
||||
for(var i=0; i<items.length;i++) {
|
||||
|
|
@ -949,12 +962,9 @@ function listMidMenuItems2(commandString, jsonResponse1, jsonResponse2, toMidmen
|
|||
$midmenuItem1.data("toRightPanelFn", toRightPanelFn);
|
||||
toMidmenuFn(items[i], $midmenuItem1);
|
||||
bindClickToMidMenu($midmenuItem1, toRightPanelFn, getMidmenuIdFn);
|
||||
|
||||
if($midMenuContainer == null)
|
||||
$midMenuContainer = $("#midmenu_container");
|
||||
|
||||
$midMenuContainer.append($midmenuItem1.show());
|
||||
if(clickFirstItem == true && i == 0) { //click the 1st item in middle menu as default
|
||||
|
||||
$("#midmenu_container").append($midmenuItem1.show());
|
||||
if(i == 0) { //click the 1st item in middle menu as default
|
||||
$midmenuItem1.click();
|
||||
if(isMultipleSelectionInMidMenu == true) {
|
||||
$midmenuItem1.addClass("ui-selected"); //because instance page is using JQuery selectable widget to do multiple-selection
|
||||
|
|
@ -997,7 +1007,7 @@ function listMidMenuItems(commandString, jsonResponse1, jsonResponse2, rightPane
|
|||
});
|
||||
removeDialogs();
|
||||
afterLoadRightPanelJSPFn();
|
||||
listMidMenuItems2(commandString, jsonResponse1, jsonResponse2, toMidmenuFn, toRightPanelFn, getMidmenuIdFn, isMultipleSelectionInMidMenu, true);
|
||||
listMidMenuItems2(commandString, jsonResponse1, jsonResponse2, toMidmenuFn, toRightPanelFn, getMidmenuIdFn, isMultipleSelectionInMidMenu, 1);
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue