![](/img/trans.png)
[英]My jquery ajax call is not working when I call web services which retrieves data from database
[英]when i reached the last page, I make an AJAX call to the server for more data from my database without waiting to click my next button
我的服务器上有一个拥有超过3万条记录的大型数据库。 我向服务器发出请求,向我提供了前100条记录,并通过Googlevisualization表分页Api进行显示-每页10条记录。
在这里的代码中,我为“ page”事件添加了一个事件侦听器,并测试了该事件的page属性:如果到达最后一页,则进行AJAX调用以获取更多数据(另外100条记录)
问题是,如果我到达最后一页,它只会加载一秒钟,然后立即进行Ajax调用,而无需等待单击下一步,因此不会改变我的page属性! 我该怎么做-当我到达最后一个要启用的下一个按钮时,只有当我单击它时,才能加载下一个100条记录
这是到目前为止我尝试过的代码:
<html>
<head>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('visualization', '1', {packages: ['table']});
</script>
<script>
var xmlhttp;
if (window.XMLHttpRequest)
{
xmlhttp = new XMLHttpRequest();
} else
{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
var intRpp=100;
var intPNum;
var glPNum;
var s;
var options = {'showRowNumber': true, 'pageSize':intPageSize };
var numberOfPages;
var intPageSize=10;
function loadXMLDoc(l)
{
intPNum=l;
s=l;
xmlhttp.onreadystatechange = function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
//alert(xmlhttp.responseText);
var xmlObj = xmlhttp.responseXML;
var textXML = xmlObj.documentElement.firstChild.firstChild.nodeValue;
if (window.DOMParser)
{
parser=new DOMParser();
var xmlDoc=parser.parseFromString(textXML,"text/xml");
}
else // Internet Explorer
{
var xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async=false;
xmlDoc.loadXML(textXML);
}
var rec = new Array();
rec[0]=['Стопански субект', 'Юрид.форма', 'Община', 'Име', 'Роля', 'Страна', 'NACE code', 'NACE text', 'Селище', 'пощ.код','Адрес', 'тел.', 'факс', 'Email', 'web', 'rid','id','activ'];
var rows = xmlDoc.getElementsByTagName("row");
rowsn = rows.length;
for (i=1;i<=rowsn;i++)
{
var cols=rows[i-1].getElementsByTagName("colunm");
colsn=cols.length;
rec[i] = new Array();
for (var j=0; j<colsn; j++)
{
rec[i][j] = cols[j].getAttribute("colvalue");
}
rec[i][j]='<input type="button" onClick="ajaxDBDelete('+rec[i][15]+');"/>';
}
tblTst = google.visualization.arrayToDataTable(rec);
options['page'] = 'event';
options['pageSize'] = intPageSize;
options['pagingSymbols'] = {prev: 'prev', next: 'next'};
options['pagingButtonsConfiguration'] = 'both';
options['allowHtml'] = 'true';
numberOfPages = intRpp/intPageSize;
visual = new google.visualization.Table(document.getElementById('table'));
google.visualization.events.addListener(visual, 'page', function (e){
options.startPage = e.page;
if (s>1)
{
glPNum = (numberOfPages * (s-1)) + (e.page+1);
document.getElementById('txbNumPage').value = glPNum;
options['pagingButtonsConfiguration']='both';
}
else
{
glPNum = e.page+1;
if (glPNum==1) options['pagingButtonsConfiguration']='next';
else options['pagingButtonsConfiguration']='both';
}
document.getElementById('txbNumPage').value = glPNum;
visual.draw(tblTst, options);
if (e.page == numberOfPages-1)
{
loadXMLDoc(s+1);
options.startPage = 0;
}
else
{
if((e.page==0)&&(s>1))
{
loadXMLDoc(s-1);
options.startPage=numberOfPages-1;
}
}
});
visual.draw(tblTst, options);
}
}
//alert (intRpp);
var url = "http://78.130.187.38:8080/axis2/services/bucat2/SelectFromDB?intRpp=" +intRpp + "&pageNum="+intPNum;
//alert (url);
xmlhttp.open("GET", url, true);
xmlhttp.send();
}
</script>
</head>
<body onload= "loadXMLDoc(1);">
<br>
<br>
<div id="table"></div>
<br/>
<button type="button" name="btnFP" onClick="loadXMLDoc(1);">FIRST PAGE</button>
<input type="input" id="txbNumPage" value=1 />
<button type="button" name="btnLP" onClick="ajaxDBLast();">LAST PAGE</button>
<br>
<div id='proba'>
</div>
</body>
</html>
我该怎么做-当我到达最后一个要启用的下一个按钮时,只有当我单击它时,才能加载下一个100条记录
loadXMLDoc
重新分配给一个空函数
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.