SUGGEST

超级的input,拥有弹出层滚动选择,ajax建议的autocomplete,效果图来两张

autocomplete,自动匹配

弹出层,选择所有可选择的

1. 载入必要的文件

public/img/js/lib/cmstop.suggest.js
public/img/js/lib/suggest/style.css

2. 使用

html代码

<input  width="300" # 宽度
            url="?app=system&controller=template&action=suggestSource" #
匹配获取数据的url
            allUrl="?app=system&controller=template&action=pageSource" #
弹出层滚动数据url
            paramKeyword="keyword" #
关键字传参键值
            paramPage="page" #
分页传参键值
            name="source" class="suggest" />
</code
 
JS
代码
<code jquery>
$(‘.suggest’).suggest({
       width:<int>,
       url:<string>,
       paramKeyword:<string>,
       allUrl:<string>,
       paramPage:<string>, //
以上参数是统一的默认配置,最终生效配置取element的属性
       getExtraData:function(){} //
发送请求时,获得多余的传递数据
})

服务器端返回数据约定

suggest数据<Array>// 建议返回10条以下的数据给我
[
  {text:<string>,value:<mixed>},
  {text:<string>,value:<mixed>},
  {text:<string>,value:<mixed>}
]
分页每页记录数20,我已经写死了,不好意思,所以查询的时候请用pagesize=20
滚动分页数据<Hash>:
{
   total:<int>, //
所有记录数, 一般在第一次请求时需要,但如果不知何时需要,就每次都发送吧
   data:[] //
suggest数据
}



Copyright ©2009 - 2014 CmsTop.Com.All rights reserved.
思拓合众