JQuery 输入下拉框插件后台分页
基于Jquery的输入下拉框插件：FlexBox插件一 下载地址
http://www.fairwaytech.com/flexbox 可以下载例子和相关文档，总共有十个示例代码供大家参考。
二 引入相关文件
<link rel="stylesheet" type="text/css" href="<%=path%>/css/jquery.flexbox.css" /> <script type='text/javascript' src='<%=path%>/js/jquery1.4.2-min.js'></script> <script type="text/javascript" src="<%=path%>/js/jquery.flexbox.js"></script>
三 相关JavaScript代码
<script type="text/javascript"> $(document).ready(function (){ $("#ffb1").flexbox ('queryCombox.action',{ resultTemplate:'<div class="col1">{name}</div>', paging: { style: 'input', cssClass: 'paging', pageSize: 6, showSummary: true, summaryClass: 'summary', maxPageLinks: 5, summaryTemplate: 'Displaying {start}-{end} of {total} results' } }); }); </script>
{name}在JSON的键名字{"total":18,"results":[{"id":"1001","name":"wangwu"},{"id":"1002","name":"wangliu"},{"id":"1003","name":"wangqi"},{"id":"2001","name":"王海"},{"id":"2002","name":"王成凯"},{"id":"2003","name":"王雨"},{"id":"2004","name":"王蒙"},{"id":"2005","name":"王依"},{"id":"2006","name":"王静"},{"id":"2007","name":"王酷"},{"id":"2008","name":"王过洋"},{"id":"2009","name":"王金龙"},{"id":"2010","name":"王浩"},{"id":"2011","name":"王海"},{"id":"2012","name":"陈浩"},{"id":"2013","name":"陈成"},{"id":"2014","name":"陈五"},{"id":"2015","name":"陈六"}]}
四 后台分页需要的参数
FlexBox默认的Ajax提交方式Get，可以在FirBug可以看到请求传递的参数，
S代表分页大小，P代表当前页数
五 效果图
http://dl.iteye.com/upload/attachment/372185/d74a0038-1a08-34f8-aed6-8d766071e29f.jpg
页:
[1]