我正在寻找有关使用 jquery 对数据库中的多个结果进行分页的难度的信息。我已经找到了一个插件,但我认为这不是我需要的。
我有一个带有 8 个文本框的表单。我想用第一个数据库结果填充这 8 个文本框,然后在有更多结果时显示分页。如果有更多结果,那么用户应该能够单击下一步按钮将新数据导入文本框。
有人有什么建议吗?
我正在寻找有关使用 jquery 对数据库中的多个结果进行分页的难度的信息。我已经找到了一个插件,但我认为这不是我需要的。
我有一个带有 8 个文本框的表单。我想用第一个数据库结果填充这 8 个文本框,然后在有更多结果时显示分页。如果有更多结果,那么用户应该能够单击下一步按钮将新数据导入文本框。
有人有什么建议吗?
You haven't mentioned which underlying platform you are using. It is ASP.NET MVC? Ruby on Rails? Paging support is generally built into the underlying platform.
If you want to make an AJAX or JSON call jQuery is certainly capable of doing that, but what that call looks like will depend on which platform you are using.
If it is Ruby, you should find some guidance here: http://www.sitepoint.com/article/ajax-jquery/
执行此操作的方式(或我执行此操作的方式)是将 ajax 调用绑定到分页链接。这些链接具有内置的 url,并且知道它们所指的页面。
例如
<a class="pager" href="/ajax_pages/get_results.php?page=3"> 3 </a>
现在您可以使用 jquery live 功能拦截对这些链接的点击
$(function() {
$('a.pager').live('click',function() {
var url = $(this).attr('href');
$('#destination').load(url);
}
}
由于您使用的是“live”,因此您不必手动绑定新生成的 HTML。因此,您的链接将立即准备就绪。
然后您所要做的就是根据请求的页面和限制(您的后端服务应该知道)生成偏移值。
替代方法非常接近,但需要在 javascript 中进行更多工作。让您的寻呼机调用的服务返回 json 编码数据。然后,您的回调函数必须使用此数据填充您的页面,然后更新您的分页链接,以便它们正常工作。
这可能是比每次都吹出整个表格更优雅的解决方案,但确实需要更多的工作。不太可能有明显的差异。
就个人而言,如果我知道我真的不会超过 5 页左右,我会完全放弃 Ajax 的东西......不是我不喜欢它......我只是认为它没有必要案子。
<?php
// Example Database result (say, 2 "pages" worth)...
// We'll pretend the cells in your database match the textarea names...
$results = array(
[0] => array(
'textbox1'=>'abc',
'textbox2'=>'def',
'textbox3'=>'ghi',
'textbox4'=>'jkl',
'textbox5'=>'mno',
'textbox6'=>'pqr'
'textbox6'=>'stu'
'textbox6'=>'vwx'
),
[1] => array(
'textbox1'=>'cba',
'textbox2'=>'fed',
'textbox3'=>'ihg',
'textbox4'=>'lkj',
'textbox5'=>'onm',
'textbox6'=>'rqp'
'textbox6'=>'uts'
'textbox6'=>'xwv'
)
)
$json_results = json_encode($results);
?>
<!-- Generate some jQuery and HTML -->
<script language="javascript">
var pages = eval('<?=$json_results;?>');
$(function() {
$('.page_num').live('click',function() {
var page = $(this).attr('rel');
if(pages[page] && pages[page].length > 0) {
$.each(pages[page],function(key,value) {
// assuming your key names are the same as the
// names of your textareas
$('textarea[name="'+key+'"]').value(value);
});
} else {
alert("Oops, that page doesn't exist for some reason...");
}
});
});
</script>
<?php foreach($results[0] as $key=>$value): ?>
<textarea name="<?=$key?>"><?=$value;?></textarea>
<?php endforeach; ?>
<div id="page_nums">
<?php for($i=1;$i<=sizeof($results)-1;$i++): ?>
<a class="page_num" href="#" rel="<?=$i;?>"><?=$i;?></a>
<?php endfor; ?>