Ajax DataGrid Support Product Page

Answered

Refresh my ajax datagrid automatically.

Asked 09 Mar 2013 10:46:38
1
has this question
09 Mar 2013 10:46:38 serdar kinay posted:
Hi,

i can't do that "auto refresh without user interaction".Here is my script code :

function startGridRfresh(id,interval){
if ($('#'+id).length > 0)
{
interval=(isNaN(parseInt(interval)) ? 5 : Math.abs(parseInt(interval || 5))) * 1000;
if (window[id+'refreshInterval']) window.clearInterval(window[id+'refreshInterval']);
window[id+'refreshInterval']=window.setInterval(
function(){controlAjaxDataGrid(document,id,'reload');},
interval
);
}
}

Is it true?Because i add this code my .asp page then i watched your tutorial video and i did all of them. But it didn't work.Could you please help me.Because it is very important for me.

Regards
Serdar

Replies

Replied 13 Mar 2013 11:18:54
13 Mar 2013 11:18:54 Vulcho Vulev replied:
Hello Serdar.

Can you try to apply the onLoad behavior event with the function mentioned in the tutorial on the <body> tag of your page?

the function in your question should be build like in our tutorial :

  <script type="text/javascript">
		function startGridRfresh(id, interval) {
			if ($('#' + id).length > 0) {
				interval = (isNaN(parseInt(interval)) ? 30 : Math.abs(parseInt(interval || 30))) * 1000;
				if (window[id + 'refreshInterval']) window.clearInterval(window[id + 'refreshInterval']);
				window[id + 'refreshInterval' ]= window.setInterval(
				function(){controlAjaxDataGrid(document, id, 'reload');},
				interval
				);
			}
		}
		</script>
Replied 14 Mar 2013 16:30:35
14 Mar 2013 16:30:35 serdar kinay replied:
Thanx for your answer.i did all of them.But it did not work.Here is my code;


<body onLoad="MM_callJS('startGridRfresh(\'dmx_grid1\',5);')">
<div class="dmxgrid">

<script type="text/javascript">
function startGridRfresh(id, interval) {
if ($('#' + id).length > 0) {
interval = (isNaN(parseInt(interval)) ? 30 : Math.abs(parseInt(interval || 30))) * 1000;
if (window[id + 'refreshInterval']) window.clearInterval(window[id + 'refreshInterval']);
window[id + 'refreshInterval' ]= window.setInterval(
function(){controlAjaxDataGrid(document, id, 'reload');},
interval
);
}
}
</script>
<script type="text/javascript" language="javascript">
<!--
$(function(){$('#dmx_grid1').flexigrid({
url: "ajax_servers/dmx_grid1.asp",
width: 500,
title: "datalar",
showToggleBtn: false,
dataType: "json",
rpOptions: [5, 10, 15, 20, 25, 30, 35, 40, 45, 50],
colModel: [{
display: "ofis id",
name: "ofis_id",
width: 100,
sortable: true,
align: "left",
hide: true
},
{
display: "ofis adi",
name: "ofis_adi",
width: 100,
sortable: true,
align: "left",
hide: false
},
{
display: "ofis adres",
name: "ofis_adres",
width: 100,
sortable: true,
align: "left",
hide: false
},
{
display: "ofis tel",
name: "ofis_tel",
width: 100,
sortable: true,
align: "left",
hide: false
},
{
display: "ofis faks",
name: "ofis_faks",
width: 100,
sortable: true,
align: "left",
hide: false
},
{
display: "ofis mail",
name: "ofis_mail",
width: 100,
sortable: true,
align: "left",
hide: false
}]
});});
//-->
</script>
<table id="dmx_grid1"><tr><td></td></tr></table>

</div>
</body>

Replied 26 Mar 2013 11:41:14
26 Mar 2013 11:41:14 Vulcho Vulev replied:
Hello Serdar.

Perform the following step by step guide:

Quote

1.)First when grid is created select the <body> tag.
2.)Click on "Tag inspector" tab in DW.
3.)Select "Behaviors".
4.)Select "onLoad" from available events.
5.)Click on the "Add behavior" (the plus icon).
6.)Select DMXZone > Control Ajax Datagrid.
7.)From the dialog box select:
Where to execute: Current Window
Grid ID: dmx_grid1
Select action: Reload Grid Contents
8.)Click OK button in order to apply the behavior.
9.)Place the script function for reloading the grid after the created behavior.
10.)Revert the body tag to the original state from:
<body onload="controlAjaxDataGrid(document, 'dmx_grid1', 'reload')">

to:
<body>

11.)Select the <body> tag and apply again onLoad behavior this time use the "Call Javascript" options and type :
Quote
startGridRfresh('dmx_grid1', 5);

12.)if everything has been executed correctly your code will look similar to:
<script type="text/javascript">
function controlAjaxDataGrid(scope, id, action) {//v1.3
	var j = window.$ || null, scope = scope || document;
	if (scope != document &&  scope.document) {
		j = scope.$ || null;
		scope = scope.document;
	}
	if (!j) return;
	var tgt = scope.getElementById(id);
	if (tgt && tgt.grid) {
		switch (action) {
			case 'reload'   :j('#' + id, scope).flexReload();break;
			case 'goToPage' :tgt.grid.changePage(arguments[3] || '');break;
			case 'setFilter':
				if (arguments[3] && arguments[3] == 'custom') {
					j('#' + id, scope).setFilter(
						arguments[4] || '',
						arguments[5] || '',
						arguments[6] || ''
					);
				} else if (arguments[3] && arguments[3] == 'form') {
					j('#' + id, scope).setFilter(
						arguments[4] || '',
						arguments[5] || '',
						arguments[6] ? $(arguments[6]).val() : ''
					);
				}
			break;
		}
	}
}
</script>
<script type="text/javascript">
function startGridRfresh(id, interval) { 
if ($('#' + id).length > 0) { 
interval = (isNaN(parseInt(interval)) ? 30 : Math.abs(parseInt(interval || 30))) * 1000; 
if (window[id + 'refreshInterval']) window.clearInterval(window[id + 'refreshInterval']); 
window[id + 'refreshInterval' ]= window.setInterval( 
function(){controlAjaxDataGrid(document, id, 'reload');}, 
interval 
); 
} 
}
function MM_callJS(jsStr) { //v2.0
  return eval(jsStr)
}
</script> 
</head>

<body onload="MM_callJS('startGridRfresh(\'dmx_grid1\', 5);')">


13.)Save and preview the page in your favourite browser.



Regards:Vulcho.
Replied 24 Oct 2013 21:31:45
24 Oct 2013 21:31:45 serdar kinay replied:

Done!!

Thank you very much ...

Reply to this topic