Print Page - Use Pagination event on datagrid

Title: Use Pagination event on datagrid - Closed
Post by: shivavalkyre on June 28, 2015, 11:01:32 PM

Hi,

can someone help me please.., i have problem with use pagination event at datagrid. i want to use pagination to refresh another datagrid, i use two datagrid in my design first as header and second as detail, i want to use pagination at my first datagrid to refresh data at my second datagrid, i have try event at pagination datagrid and it work perfectly when pagination fires but data won't change only number of pagination.

Here My Script:

Code:

<script>
		$(function(){
			var pager = $('#dg').datagrid('getPager');	// get the pager of datagrid
			pager.pagination({ 

		onSelectPage:function(pageNumber, pageSize){

		onClickRow()
	}

			});
			
		});



 function onClickRow(){
    var row = $('#dg').datagrid('getSelected');
    if (row){
    //alert(row.voucher_id);
	//document.getElementById("detail_id").value = row.voucher_id;
	$('#dg1').datagrid({
      url:'./control/getdata_detail.php?voucher_id=' + row.voucher_id});
	  //get total value
	  var string = "voucher_id="+row.voucher_id
		 $.ajax({
			type	: 'POST',
			url		: "./control/ff2.php",
			data	: string,
			cache	: false,
			success	: function(data){
				//var win = $.messager.progress({
				//title:'Please waiting',
				//msg:'Loading data...'
				//});
				setTimeout(function(){
					$.messager.progress('close');
					$("#p3").html(data);
					//alert("Data: " + string );
				},100)
			}		
		});
    }
}

	</script>

Title: Re: Use Pagination event on datagrid
Post by: stworthy on June 29, 2015, 12:25:53 AM

Please try this:

Code:

var dg = $('#dg');
var pager = dg.datagrid('getPager');
var popts = pager.pagination('options');
var onSelectPage = popts.onSelectPage;
popts.onSelectPage = function(pageNumber, pageSize){
    onSelectPage.call(this, pageNumber, pageSize);
    // your code here
}

Title: Re: Use Pagination event on datagrid
Post by: shivavalkyre on June 29, 2015, 02:06:37 AM

i have try your code but it don't have any effect when i try to change pagination record. i try to combine it with my code like this :

Code:


	var dg = $('#dg');
	var pager = dg.datagrid('getPager');
	var popts = pager.pagination('options');
	var onSelectPage = popts.onSelectPage;
	popts.onSelectPage = function(pageNumber, pageSize){
    onSelectPage.call(this, pageNumber, pageSize);
	$('#dg').datagrid('selectAll');
    onClickRow()
}

Title: Re: Use Pagination event on datagrid
Post by: stworthy on June 29, 2015, 05:15:01 PM

Before selecting or clicking a row, make sure the records are loaded successfully. So the 'onLoadSuccess' event may be more suitable for you.

Code:

$('#dg').datagrid({
  onLoadSuccess: function(){
    $(this).datagrid('selectAll');
    //...
  }
});

Title: Re: Use Pagination event on datagrid
Post by: shivavalkyre on June 29, 2015, 06:23:56 PM

Hi, after I analyze your code and my code difference is in "this" at onSelectPage. but if i add "this" at onSelectPage my code datagrid selectRow and other code not working. but if i remove "this" from code my code is working but my data at datagrid header still on first page not move to actual page so my datagrid detail show data my first page not my second page data.

Code:

		$(function(){
			var pager = $('#dg').datagrid('getPager');	// get the pager of datagrid
			pager.pagination({ 
	//onBeforeRefresh:function(){
	//				alert('before refresh');
	//				return true;
	//			}
		onSelectPage:function(pageNumber, pageSize){
		//$(this).pagination('loading');
		//alert('pageNumber:'+pageNumber+',pageSize:'+pageSize);
		//$(this).pagination('loaded');
		$('#dg').datagrid('selectRow',0);
		onClickRow()
	}

				});
			
		});

Title: Re: Use Pagination event on datagrid
Post by: shivavalkyre on June 29, 2015, 06:47:24 PM

OK, Thanks for your solution it works great..., but why we can not do it from pagination event?

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: shivavalkyre on June 28, 2015, 11:01:32 PM