dhis2-devs team mailing list archive
-
dhis2-devs team
-
Mailing list archive
-
Message #12323
[Branch ~dhis2-devs-core/dhis2/trunk] Rev 3760: minor cosmetic fixes to paging box
------------------------------------------------------------
revno: 3760
committer: Morten Olav Hansen <mortenoh@xxxxxxxxx>
branch nick: dhis2
timestamp: Thu 2011-05-26 21:30:56 +0200
message:
minor cosmetic fixes to paging box
modified:
dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/jQuery/jquery.dhisPaging.js
--
lp:dhis2
https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk
Your team DHIS 2 developers is subscribed to branch lp:dhis2.
To unsubscribe from this branch go to https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk/+edit-subscription
=== modified file 'dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/jQuery/jquery.dhisPaging.js'
--- dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/jQuery/jquery.dhisPaging.js 2011-05-26 14:44:02 +0000
+++ dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/jQuery/jquery.dhisPaging.js 2011-05-26 19:30:56 +0000
@@ -32,12 +32,12 @@
// -----------------------------------------------
// Support functions
// -----------------------------------------------
-
// Array Remove - By John Resig (MIT Licensed)
-Array.remove = function(array, from, to) {
- var rest = array.slice((to || from) + 1 || array.length);
- array.length = from < 0 ? array.length + from : from;
- return array.push.apply(array, rest);
+Array.remove = function(array, from, to)
+{
+ var rest = array.slice((to || from) + 1 || array.length);
+ array.length = from < 0 ? array.length + from : from;
+ return array.push.apply(array, rest);
};
/* perform dblclick action on the sourceId */
@@ -57,67 +57,71 @@
/*
*
*/
-function dhisPaging_availableList_dblclick(sourceId, targetId, removeArray) {
- return function() {
+function dhisPaging_availableList_dblclick(sourceId, targetId, removeArray)
+{
+ return function()
+ {
var jqAvailableList = jQuery("#" + sourceId);
var jqSelectedList = jQuery("#" + targetId);
-
+
var settings = jqAvailableList.data("settings");
-
- jqAvailableList.find(":selected").each(function(i) {
+
+ jqAvailableList.find(":selected").each(function(i)
+ {
var jqThis = jQuery(this);
var option_id = +jqThis.attr("value");
-
- jqSelectedList.append( this );
-
- if( jQuery.isArray(settings[removeArray]) ) {
+
+ jqSelectedList.append(this);
+
+ if (jQuery.isArray(settings[removeArray])) {
settings[removeArray].push(option_id);
} else {
- settings[removeArray] = [option_id];
+ settings[removeArray] = [ option_id ];
}
});
-
- if(settings[removeArray] && settings[removeArray].length > 0) {
+
+ if (settings[removeArray] && settings[removeArray].length > 0) {
settings.params[removeArray] = settings[removeArray].join(",");
} else {
delete settings[removeArray];
delete settings.params[removeArray];
}
-
+
jqAvailableList.dhisPaging("load", sourceId);
}
}
/*
- *
+ *
*/
-function dhisPaging_selectedList_dblclick(sourceId, targetId, removeArray) {
- return function() {
+function dhisPaging_selectedList_dblclick(sourceId, targetId, removeArray)
+{
+ return function()
+ {
var jqAvailableList = jQuery("#" + targetId);
var jqSelectedList = jQuery("#" + sourceId);
-
+
var settings = jQuery("#" + targetId).data("settings");
-
- jqSelectedList.find(":selected").each(function(i) {
+
+ jqSelectedList.find(":selected").each(function(i)
+ {
var jqThis = jQuery(this);
var option_id = +jqThis.attr("value");
jqThis.remove();
-
- if( jQuery.isArray(settings[removeArray]) )
- {
+
+ if (jQuery.isArray(settings[removeArray])) {
var remove_idx = jQuery.inArray(option_id, settings[removeArray]);
Array.remove(settings[removeArray], remove_idx, remove_idx);
- //settings[removeArray].splice(remove_idx, remove_idx+1);
}
});
- if(settings[removeArray] && settings[removeArray].length > 0) {
+ if (settings[removeArray] && settings[removeArray].length > 0) {
settings.params[removeArray] = settings[removeArray].join(",");
} else {
delete settings[removeArray];
delete settings.params[removeArray];
}
-
+
jqAvailableList.dhisPaging("load", targetId);
}
}
@@ -126,230 +130,276 @@
// Plugin
// -----------------------------------------------
-(function($) {
- var templates = {
- wrapper: "<div id='${id}' style='padding: 0; margin: 0; background-color: #eee; border: 1px solid #666;' />",
- button: "<button id='${id}' type='button' style='width: 70px; margin: 4px;'>${text}</button>",
- option: "<option>${text}</option>",
- option_selected: "<option selected='selected'>${text}</option>",
- pagesize_input: "Page size <input id='${id}' type='text' style='width: 50px;'/>",
- filter_input: "<input id='${id}' placeholder='Filter' type='text' style='width: 100%; height: 18px; border: 1px inset #888;' />",
- filter_select: "<select id='${id}' style='width: 100%; margin-bottom: 4px; margin-top: 0;'></select>",
- select_page: "Page <select id='${id}' style='width: 50px;'></select>"
- }
-
- var methods = {
- load: function(select_id) {
- var $select = $("#" + select_id);
- var settings = $select.data("settings");
- var params = settings.params;
-
- var id = $select.attr("id");
- var wrapper_id = id + "_wrapper";
- $wrapper = $("#" + wrapper_id);
- var select_page_id = id + "_select_page";
- var $select_page = $("#" + select_page_id);
- var next_button_id = id + "_next_button";
- var $next_button = $("#" + next_button_id);
- var previous_button_id = id + "_previous_button";
- var $previous_button = $("#" + previous_button_id);
- var filter_input_id = id + "_filter_input";
- var $filter_input = $("#" + filter_input_id);
- var filter_select_id = id + "_filter_select";
- var pagesize_input_id = id + "_pagesize_input";
- var $pagesize_input = $("#" + pagesize_input_id);
-
- $.post(settings.source, $.param( settings.params ), function(json) {
- $select.empty();
- $select_page.empty();
-
- params.currentPage = json.paging.currentPage == 0? 1 : json.paging.currentPage;
- params.numberOfPages = json.paging.numberOfPages == 0? 1 : json.paging.numberOfPages;
- params.pageSize = json.paging.pageSize;
- params.startPage = json.paging.startPage;
-
- $.each(json[settings.iterator], function(i, item) {
- var option = jQuery(settings.handler(item));
- $select.append( option );
- });
-
- for(var j=1; j<=params.numberOfPages; j++) {
- if(params.currentPage == j) {
- $select_page.append( $.tmpl(templates.option_selected, {"text": j}) );
+(function($)
+{
+ var templates = {
+ wrapper : "<div id='${id}' style='padding: 0; margin: 0; background-color: #fefefe; border: 1px solid gray;' />",
+ button : "<button id='${id}' type='button' style='width: 70px; margin: 4px;'>${text}</button>",
+ option : "<option>${text}</option>",
+ option_selected : "<option selected='selected'>${text}</option>",
+ pagesize_input : " Page size <input id='${id}' type='text' style='width: 50px;'/>",
+ filter_input : "<input id='${id}' placeholder='Filter' type='text' style='width: 100%; height: 18px; border: 1px inset gray;' />",
+ filter_select : "<select id='${id}' style='width: 100%; margin-bottom: 4px; margin-top: 0;'></select>",
+ select_page : "Page <select id='${id}' style='width: 50px;'></select>"
+ }
+
+ var methods = {
+ load : function(select_id)
+ {
+ var $select = $("#" + select_id);
+ var settings = $select.data("settings");
+ var params = settings.params;
+
+ var id = $select.attr("id");
+ var wrapper_id = id + "_wrapper";
+ $wrapper = $("#" + wrapper_id);
+ var select_page_id = id + "_select_page";
+ var $select_page = $("#" + select_page_id);
+ var next_button_id = id + "_next_button";
+ var $next_button = $("#" + next_button_id);
+ var previous_button_id = id + "_previous_button";
+ var $previous_button = $("#" + previous_button_id);
+ var filter_input_id = id + "_filter_input";
+ var $filter_input = $("#" + filter_input_id);
+ var filter_select_id = id + "_filter_select";
+ var pagesize_input_id = id + "_pagesize_input";
+ var $pagesize_input = $("#" + pagesize_input_id);
+
+ $.post(settings.source, $.param(settings.params), function(json)
+ {
+ $select.empty();
+ $select_page.empty();
+
+ params.currentPage = json.paging.currentPage == 0 ? 1 : json.paging.currentPage;
+ params.numberOfPages = json.paging.numberOfPages == 0 ? 1 : json.paging.numberOfPages;
+ params.pageSize = json.paging.pageSize;
+ params.startPage = json.paging.startPage;
+
+ $.each(json[settings.iterator], function(i, item)
+ {
+ var option = jQuery(settings.handler(item));
+ $select.append(option);
+ });
+
+ for ( var j = 1; j <= params.numberOfPages; j++) {
+ if (params.currentPage == j) {
+ $select_page.append($.tmpl(templates.option_selected, {
+ "text" : j
+ }));
+ } else {
+ $select_page.append($.tmpl(templates.option, {
+ "text" : j
+ }));
+ }
+ }
+
+ $("#" + pagesize_input_id).val(params.pageSize);
+
+ $previous_button.removeAttr("disabled");
+ $next_button.removeAttr("disabled");
+
+ if (params.currentPage == params.startPage) {
+ $previous_button.attr("disabled", "disabled");
+ }
+
+ if (params.currentPage == params.numberOfPages) {
+ $next_button.attr("disabled", "disabled");
+ }
+ });
+ },
+ init : function(options)
+ {
+ var settings = {}
+ var params = {}
+
+ $.extend(settings, options);
+ $.extend(params, options.params);
+ params.usePaging = true;
+
+ var $select = $(this);
+ $select.css("border", "none");
+ var id = $(this).attr("id");
+ var wrapper_id = id + "_wrapper";
+ var select_page_id = id + "_select_page";
+ var next_button_id = id + "_next_button";
+ var previous_button_id = id + "_previous_button";
+ var filter_input_id = id + "_filter_input";
+ var filter_button_id = id + "_filter_button";
+ var filter_select_id = id + "_filter_select";
+ var pagesize_input_id = id + "_pagesize_input";
+
+ $select.wrap($.tmpl(templates.wrapper, {
+ "id" : wrapper_id
+ }));
+ $select.css({
+ "border-bottom" : "1px solid gray",
+ "margin-bottom" : "1px"
+ });
+
+ var $wrapper = $("#" + wrapper_id);
+
+ if (settings.filter !== undefined) {
+ $wrapper.prepend($.tmpl(templates.filter_select, {
+ "id" : filter_select_id
+ }));
+
+ if (settings.filter.label !== undefined) {
+ $wrapper.prepend("<div style='width: 100%; padding-left: 4px;'>Filter by " + settings.filter.label
+ + ":</div>");
} else {
- $select_page.append( $.tmpl(templates.option, {"text": j}) );
- }
- }
-
- $("#" + pagesize_input_id).val( params.pageSize );
-
- $previous_button.removeAttr("disabled");
- $next_button.removeAttr("disabled");
-
- if(params.currentPage == params.startPage) {
- $previous_button.attr("disabled", "disabled");
- }
-
- if(params.currentPage == params.numberOfPages) {
- $next_button.attr("disabled", "disabled");
- }
- });
- },
- init: function(options) {
- var settings = { }
- var params = { }
-
- $.extend(settings, options);
- $.extend(params, options.params);
- params.usePaging = true;
-
- var $select = $(this);
- $select.css("border", "none");
- var id = $(this).attr("id");
- var wrapper_id = id + "_wrapper";
- var select_page_id = id + "_select_page";
- var next_button_id = id + "_next_button";
- var previous_button_id = id + "_previous_button";
- var filter_input_id = id + "_filter_input";
- var filter_button_id = id + "_filter_button";
- var filter_select_id = id + "_filter_select";
- var pagesize_input_id = id + "_pagesize_input";
-
- $select.wrap( $.tmpl(templates.wrapper, { "id": wrapper_id }) );
- var $wrapper = $("#" + wrapper_id);
-
- if(settings.filter !== undefined) {
- $wrapper.prepend( $.tmpl(templates.filter_select, { "id": filter_select_id } ) );
-
- if( settings.filter.label !== undefined ) {
- $wrapper.prepend( "<div style='width: 100%; padding-left: 4px;'>Filter by " + settings.filter.label + ":</div>" );
- } else {
- $wrapper.prepend( "<div style='width: 100%; padding-left: 4px;'>Filter by:</div>" );
- }
-
- var $filter_select = $("#" + filter_select_id);
-
- $.getJSON(settings.filter.source, function(json) {
- $filter_select.empty();
- $filter_select.append( "<option>All</option>");
-
- $.each(json[settings.filter.iterator], function(i, item) {
- var option = jQuery(settings.filter.handler(item));
- $filter_select.append( option );
- });
- });
-
- $filter_select.bind("change", {"id": id}, function(event) {
- var $option = $(this).find(":selected");
- var key = $option.data("key");
- var value = $option.data("value");
-
- key = !! key ? key : "";
- value = !! value ? value : "";
-
- var settings = $("#" + event.data.id).data("settings");
-
- if(key !== "") {
- settings.params[key] = value;
- settings.filter_select_key = key;
- } else {
- if(settings.filter_select_key !== undefined) {
- delete settings.params[settings.filter_select_key];
- delete settings.filter_select_key;
- }
- }
-
- settings.params.currentPage = 1;
- methods.load(event.data.id);
- });
- }
-
- var $filter_table = $("<table/>");
- $filter_table.css({
- "padding": "1px",
- "width": "100%"
- });
-
- var $filter_tr = $("<tr/>");
-
- var $filter_td1 = $("<td/>")
- var $filter_td2 = $("<td/>")
- $filter_td2.css("width", "70px");
-
- $filter_td1.append( $.tmpl(templates.filter_input, { "id": filter_input_id }) )
- $filter_td2.append( $.tmpl(templates.button, {"id": filter_button_id, "text": "filter" }) );
-
- $filter_tr.append($filter_td1);
- $filter_tr.append($filter_td2);
-
- $filter_table.append($filter_tr);
-
- $wrapper.prepend( $filter_table );
-
- $wrapper.append( $.tmpl(templates.select_page, { "id": select_page_id }) )
- $wrapper.append( $.tmpl(templates.button, { "id": previous_button_id, "text":"previous" }) );
- $wrapper.append( $.tmpl(templates.button, { "id": next_button_id, "text":"next" }) );
- $wrapper.append( $.tmpl(templates.pagesize_input, { "id": pagesize_input_id }) );
-
- var $filter_input = $("#" + filter_input_id);
- var $filter_button = $("#" + filter_button_id);
- var $select_page = $("#" + select_page_id);
- var $previous_button = $("#" + previous_button_id);
- var $next_button = $("#" + next_button_id);
- var $pagesize_input = $("#" + pagesize_input_id);
-
- settings.params = params;
- $select.data("settings", settings);
- methods.load("" + id);
-
- $next_button.click(function() {
- params.currentPage = +params.currentPage + 1;
- methods.load("" + id);
- });
-
- $previous_button.click(function() {
- params.currentPage = +params.currentPage - 1;
- methods.load("" + id);
- });
-
- $filter_button.click(function() {
- params.key = $filter_input.val();
-
- if(params.key.length === 0) {
- delete params.key;
- }
-
- params.currentPage = 1;
- methods.load("" + id);
- });
-
- $filter_input.keypress(function(e) {
- if(e.keyCode == 13) {
- $filter_button.click();
- e.preventDefault();
- }
- });
-
- $select_page.change(function() {
- params.currentPage = +$(this).find(":selected").val();
- methods.load("" + id);
- });
-
- $pagesize_input.change(function() {
- params.pageSize = +$(this).val();
- params.currentPage = 1;
- methods.load("" + id);
- });
+ $wrapper.prepend("<div style='width: 100%; padding-left: 4px;'>Filter by:</div>");
+ }
+
+ var $filter_select = $("#" + filter_select_id);
+
+ $.getJSON(settings.filter.source, function(json)
+ {
+ $filter_select.empty();
+ $filter_select.append("<option>All</option>");
+
+ $.each(json[settings.filter.iterator], function(i, item)
+ {
+ var option = jQuery(settings.filter.handler(item));
+ $filter_select.append(option);
+ });
+ });
+
+ $filter_select.bind("change", {
+ "id" : id
+ }, function(event)
+ {
+ var $option = $(this).find(":selected");
+ var key = $option.data("key");
+ var value = $option.data("value");
+
+ key = !!key ? key : "";
+ value = !!value ? value : "";
+
+ var settings = $("#" + event.data.id).data("settings");
+
+ if (key !== "") {
+ settings.params[key] = value;
+ settings.filter_select_key = key;
+ } else {
+ if (settings.filter_select_key !== undefined) {
+ delete settings.params[settings.filter_select_key];
+ delete settings.filter_select_key;
+ }
+ }
+
+ settings.params.currentPage = 1;
+ methods.load(event.data.id);
+ });
+ }
+
+ var $filter_table = $("<table/>");
+ $filter_table.css({
+ "padding" : "1px",
+ "width" : "100%"
+ });
+
+ var $filter_tr = $("<tr/>");
+
+ var $filter_td1 = $("<td/>")
+ var $filter_td2 = $("<td/>")
+ $filter_td2.css("width", "70px");
+
+ $filter_td1.append($.tmpl(templates.filter_input, {
+ "id" : filter_input_id
+ }))
+ $filter_td2.append($.tmpl(templates.button, {
+ "id" : filter_button_id,
+ "text" : "filter"
+ }));
+
+ $filter_tr.append($filter_td1);
+ $filter_tr.append($filter_td2);
+
+ $filter_table.append($filter_tr);
+
+ $wrapper.prepend($filter_table);
+
+ $wrapper.append($.tmpl(templates.select_page, {
+ "id" : select_page_id
+ }))
+ $wrapper.append($.tmpl(templates.button, {
+ "id" : previous_button_id,
+ "text" : "previous"
+ }));
+ $wrapper.append($.tmpl(templates.button, {
+ "id" : next_button_id,
+ "text" : "next"
+ }));
+ $wrapper.append($.tmpl(templates.pagesize_input, {
+ "id" : pagesize_input_id
+ }));
+
+ var $filter_input = $("#" + filter_input_id);
+ var $filter_button = $("#" + filter_button_id);
+ var $select_page = $("#" + select_page_id);
+ var $previous_button = $("#" + previous_button_id);
+ var $next_button = $("#" + next_button_id);
+ var $pagesize_input = $("#" + pagesize_input_id);
+
+ settings.params = params;
+ $select.data("settings", settings);
+ methods.load("" + id);
+
+ $next_button.click(function()
+ {
+ params.currentPage = +params.currentPage + 1;
+ methods.load("" + id);
+ });
+
+ $previous_button.click(function()
+ {
+ params.currentPage = +params.currentPage - 1;
+ methods.load("" + id);
+ });
+
+ $filter_button.click(function()
+ {
+ params.key = $filter_input.val();
+
+ if (params.key.length === 0) {
+ delete params.key;
+ }
+
+ params.currentPage = 1;
+ methods.load("" + id);
+ });
+
+ $filter_input.keypress(function(e)
+ {
+ if (e.keyCode == 13) {
+ $filter_button.click();
+ e.preventDefault();
+ }
+ });
+
+ $select_page.change(function()
+ {
+ params.currentPage = +$(this).find(":selected").val();
+ methods.load("" + id);
+ });
+
+ $pagesize_input.change(function()
+ {
+ params.pageSize = +$(this).val();
+ params.currentPage = 1;
+ methods.load("" + id);
+ });
+ }
}
- }
- $.fn.dhisPaging = function(method) {
- if(methods[method]) {
- return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 ));
- } else if (typeof method === 'object' || !method) {
- return methods.init.apply(this, arguments);
- } else {
- $.error('Method ' + method + ' does not exist on jQuery.dhisPaging' );
- }
- };
+ $.fn.dhisPaging = function(method)
+ {
+ if (methods[method]) {
+ return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
+ } else if (typeof method === 'object' || !method) {
+ return methods.init.apply(this, arguments);
+ } else {
+ $.error('Method ' + method + ' does not exist on jQuery.dhisPaging');
+ }
+ };
})(jQuery, undefined);
