Fixes in ajax_list
This commit is contained in:
parent
1dcbd599d9
commit
b51eb6faf6
1 changed files with 131 additions and 15 deletions
142
ajax_list.js
142
ajax_list.js
|
|
@ -229,6 +229,13 @@ $=jQuery;
|
||||||
|
|
||||||
$.fn.ajaxListSimple = function (fields, options) {
|
$.fn.ajaxListSimple = function (fields, options) {
|
||||||
|
|
||||||
|
|
||||||
|
//console.log($(this).find('tr.row_list').attr('class'));
|
||||||
|
|
||||||
|
begin_page=0;
|
||||||
|
|
||||||
|
order_field='';
|
||||||
|
|
||||||
if(!options.hasOwnProperty("url")) {
|
if(!options.hasOwnProperty("url")) {
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -242,10 +249,51 @@ $=jQuery;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if(!options.hasOwnProperty("num_elements")) {
|
||||||
|
|
||||||
|
options.num_elements=1;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
if(!options.hasOwnProperty("initial_num_pages")) {
|
||||||
|
|
||||||
|
options.initial_num_pages=20;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
if(!options.hasOwnProperty("order_fields")) {
|
||||||
|
|
||||||
|
options.order_fields=[];
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
this.fields=fields;
|
this.fields=fields;
|
||||||
|
|
||||||
this.options=options;
|
this.options=options;
|
||||||
|
|
||||||
|
this.css_class='link_pages';
|
||||||
|
|
||||||
|
//Prepare search
|
||||||
|
|
||||||
|
for(i in options.order_fields) {
|
||||||
|
|
||||||
|
field=options.order_fields[i];
|
||||||
|
|
||||||
|
|
||||||
|
field_pos=this.fields.indexOf(field);
|
||||||
|
|
||||||
|
if(field_pos!=-1) {
|
||||||
|
|
||||||
|
html_ele='<a href="#" class="change_order" data-field="'+field+'">'+$(this).find('tr:first-child').children().eq(field_pos).html()+'</a>';
|
||||||
|
|
||||||
|
$(this).find('tr:first-child').children().eq(field_pos).html(html_ele);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
this.updateAjaxList=function () {
|
this.updateAjaxList=function () {
|
||||||
|
|
||||||
options=this.options;
|
options=this.options;
|
||||||
|
|
@ -267,7 +315,7 @@ $=jQuery;
|
||||||
$.ajax({
|
$.ajax({
|
||||||
url: options.url,
|
url: options.url,
|
||||||
type: 'GET',
|
type: 'GET',
|
||||||
data: {},
|
data: {num_elements: options.num_elements, begin_page: begin_page},
|
||||||
table: this,
|
table: this,
|
||||||
success: function (data) {
|
success: function (data) {
|
||||||
|
|
||||||
|
|
@ -279,6 +327,8 @@ $=jQuery;
|
||||||
|
|
||||||
var z=0;
|
var z=0;
|
||||||
|
|
||||||
|
$(this.table).find('tr.row_list').remove();
|
||||||
|
|
||||||
for (const row of data.items) {
|
for (const row of data.items) {
|
||||||
//console.log(element);
|
//console.log(element);
|
||||||
|
|
||||||
|
|
@ -289,7 +339,9 @@ $=jQuery;
|
||||||
|
|
||||||
//console.log(`${property}: ${row[property]}`);
|
//console.log(`${property}: ${row[property]}`);
|
||||||
|
|
||||||
$('#row_ajaxlist_'+z).append('<td>'+row[field]+'</td>');
|
var field_name=row[field];
|
||||||
|
|
||||||
|
$('#row_ajaxlist_'+z).append('<td>'+field_name+'</td>');
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
@ -300,7 +352,25 @@ $=jQuery;
|
||||||
|
|
||||||
if(data.hasOwnProperty('total_num_items')) {
|
if(data.hasOwnProperty('total_num_items')) {
|
||||||
|
|
||||||
|
var total_elements=data.total_num_items;
|
||||||
|
|
||||||
|
var num_elements=options.num_elements;
|
||||||
|
|
||||||
|
var link=options.url;
|
||||||
|
|
||||||
|
var initial_num_pages=options.initial_num_pages;
|
||||||
|
|
||||||
|
var variable='begin_page';
|
||||||
|
|
||||||
|
var label='';
|
||||||
|
|
||||||
|
var func_jscript='';
|
||||||
|
|
||||||
|
var pages=pagination( begin_page, total_elements, num_elements, link ,initial_num_pages, variable, label, func_jscript, this.table.css_class);
|
||||||
|
|
||||||
|
$('#table_pages').remove();
|
||||||
|
|
||||||
|
this.table.after('<div id="table_pages"><p>Pages: '+pages+'</p></div>');
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -333,8 +403,47 @@ $=jQuery;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
//Pages click method for change page
|
||||||
|
|
||||||
|
$(document).on('click', '.'+this.css_class, {table: this}, function (e) {
|
||||||
|
|
||||||
|
console.log('Changing page...');
|
||||||
|
|
||||||
|
begin_page=$(this).attr('data-begin');
|
||||||
|
|
||||||
|
//Update list getting begin_page variable
|
||||||
|
|
||||||
|
e.data.table.updateAjaxList();
|
||||||
|
|
||||||
|
return false;
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
//Method for change order in page
|
||||||
|
|
||||||
|
$(document).on('click', '.change_order', {table: this}, function (e) {
|
||||||
|
|
||||||
|
console.log('Changing order list...');
|
||||||
|
|
||||||
|
order_field=$(this).attr('data-field');
|
||||||
|
|
||||||
|
console.log(order_field);
|
||||||
|
|
||||||
|
begin_page=0;
|
||||||
|
|
||||||
|
//Update list getting order_field variable
|
||||||
|
|
||||||
|
//e.data.table.updateAjaxList();
|
||||||
|
|
||||||
|
return false;
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
//First loading of list
|
||||||
|
|
||||||
this.updateAjaxList();
|
this.updateAjaxList();
|
||||||
|
|
||||||
return this;
|
return this;
|
||||||
|
|
@ -345,9 +454,11 @@ $=jQuery;
|
||||||
|
|
||||||
})( jQuery );
|
})( jQuery );
|
||||||
|
|
||||||
function pagination( begin_page, total_elements, num_elements, link ,initial_num_pages=20, variable='begin_page', label='', func_jscript='') {
|
//begin_page, int: number of first element showed in table
|
||||||
|
|
||||||
|
|
||||||
|
function pagination( begin_page, total_elements, num_elements, link ,initial_num_pages, variable, label, func_jscript, css_class) {
|
||||||
|
|
||||||
css_class='link_pages';
|
|
||||||
|
|
||||||
pages='';
|
pages='';
|
||||||
|
|
||||||
|
|
@ -384,24 +495,27 @@ function pagination( begin_page, total_elements, num_elements, link ,initial_num
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
url_base=new URL(link);
|
//url_base=new URL(link);
|
||||||
|
|
||||||
if(initial_page>0) {
|
if(initial_page>0) {
|
||||||
|
|
||||||
//initial_link=add_get_parameters(link, **{variable: '0'});
|
//initial_link=add_get_parameters(link, **{variable: '0'});
|
||||||
|
|
||||||
initial_url=url_base;
|
initial_url=new URL(link);
|
||||||
initial_url.searchParams.append(variable, '0');
|
initial_url.searchParams.append(variable, '0');
|
||||||
|
|
||||||
initial_link=initial_url.href;
|
initial_link=initial_url.href;
|
||||||
|
|
||||||
//middle_link=add_get_parameters(link, **{variable: str((initial_page-num_elements)) } );
|
//middle_link=add_get_parameters(link, **{variable: str((initial_page-num_elements)) } );
|
||||||
middle_url=url_base;
|
middle_url=new URL(link);
|
||||||
middle_url.searchParams.append(variable, (initial_page-num_elements));
|
|
||||||
|
begin_page=(initial_page-num_elements);
|
||||||
|
|
||||||
|
middle_url.searchParams.append(variable, begin_page);
|
||||||
|
|
||||||
middle_link=middle_url.href;
|
middle_link=middle_url.href;
|
||||||
|
|
||||||
pages += "<a class=\""+css_class+"\" href=\""+initial_link+"\" onclick=\"${func_jscript}\">1</a> <a class=\""+css_class+"\" href=\""+middle_link+"\"><<</a> "
|
pages += "<a class=\""+css_class+"\" href=\""+initial_link+"\" onclick=\"${func_jscript}\" data-begin=\"0\">1</a> <a class=\""+css_class+"\" href=\""+middle_link+"\" data-begin=\""+begin_page+"\"><<</a> "
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -411,28 +525,29 @@ function pagination( begin_page, total_elements, num_elements, link ,initial_num
|
||||||
//for x in range(initial_page, last_page, num_elements):
|
//for x in range(initial_page, last_page, num_elements):
|
||||||
|
|
||||||
//middle_link=add_get_parameters(link, **{variable: str(x)} )
|
//middle_link=add_get_parameters(link, **{variable: str(x)} )
|
||||||
middle_url=url_base;
|
var middle_url=new URL(link);
|
||||||
|
|
||||||
middle_url.searchParams.append(variable, x);
|
middle_url.searchParams.append(variable, x);
|
||||||
|
|
||||||
middle_link=middle_url.href;
|
middle_link=middle_url.href;
|
||||||
|
|
||||||
|
|
||||||
num_page=Math.ceil(x/num_elements)+1;
|
num_page=Math.ceil(x/num_elements)+1;
|
||||||
arr_pages[x]="<a class=\""+css_class+"\" href=\""+middle_link+"\">"+num_page+"</a> ";
|
arr_pages[x]="<a class=\""+css_class+"\" href=\""+middle_link+"\" data-begin=\""+x+"\">"+num_page+"</a> ";
|
||||||
arr_pages[begin_page]='<span class="selected_page">'+num_page+'</span> ';
|
arr_pages[begin_page]='<span class="selected_page">'+num_page+'</span> ';
|
||||||
pages+=arr_pages[x];
|
pages+=arr_pages[x];
|
||||||
}
|
}
|
||||||
|
|
||||||
if (last_page<total_elements) {
|
if (last_page<total_elements) {
|
||||||
|
|
||||||
middle_url=url_base;
|
middle_url=new URL(link);
|
||||||
middle_url.searchParams.append(variable, (initial_page-num_elements));
|
middle_url.searchParams.append(variable, (initial_page-num_elements));
|
||||||
|
|
||||||
middle_link=middle_url.href;
|
middle_link=middle_url.href;
|
||||||
|
|
||||||
//last_link=add_get_parameters(link, **{variable: str( ( ( total_page*num_elements ) - num_elements) ) } )
|
//last_link=add_get_parameters(link, **{variable: str( ( ( total_page*num_elements ) - num_elements) ) } )
|
||||||
|
|
||||||
last_url=url_base;
|
last_url=new URL(link);
|
||||||
last_url.searchParams.append(variable, ( ( total_page*num_elements ) - num_elements) );
|
last_url.searchParams.append(variable, ( ( total_page*num_elements ) - num_elements) );
|
||||||
|
|
||||||
last_link=last_url.href;
|
last_link=last_url.href;
|
||||||
|
|
@ -441,6 +556,7 @@ function pagination( begin_page, total_elements, num_elements, link ,initial_num
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
return pages;
|
return pages;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue