• autocomplete自动完成


    //效果图

    //jsp引入文件
    
    <c:set var="ctx" value="${pageContext.request.contextPath}"/>
    
    <link rel="stylesheet" type="text/css" href="${ctx}/css/jquery.autocomplete.css" />
    
    <script src="${ctx}/javascripts/jquery.autocomplete.js" type="text/javascript"></script>
    //js代码
    $("#equipName").flushCache();    //刷新缓存
    $("#equipName").autocomplete("${ctx}/dp/takePoints!getUnits.action",{
      max: 30, //列表里的条目数
      minChars: 0, //自动完成激活之前填入的最小字符
       92, //提示的宽度,溢出隐藏
      scrollHeight: 300, //提示的高度,溢出显示滚动条
      matchContains: true, //包含匹配,就是data参数里的数据,是否只要包含文本框里的数据就显示
      //autoFill: false, //自动填充
      mustMatch:true, //true:只会允许匹配的结果出现在输入框,默认为false
      dataType: "json",
      //multiple: false, //是否多个值(“,”隔开)
      //matchSubset:true,
      extraParams: {
        equiptext: function(){ return encodeURIComponent($("#equipName").val()); }
      },
      parse: function(data) {
        var datas = new Array();
        if(data !=null && data.length > 0){
          $.each(data, function(i,item) {
            var _data = {
              data:item,
              value:item.name,
              result:item.name
            }
          datas.push(_data);
          })
        }
        return datas;
      },
      formatItem: function(row, i, max) {
        return row.name;
      },
      formatResult: function(row) {
        return row.name;
      }
    }).result(function(e, item, value) {
      $("#equipName").val(row.name);
    });
    //service代码
    
    @Override
    public List<Map<String, Object>> findUnits(String equiptext) {
      List<Map<String, Object>> dataList = new ArrayList<>();
      StringBuffer sb = new StringBuffer();
      List<Object> params = new ArrayList<>();
      sb.append(" from Unit obj where (1=1) ");
    
      if(equiptext != null && equiptext.length()>0){
        sb.append(" and obj.equipAlias like ? ");
        params.add("%"+equiptext+"%");
      }
      List<Unit> units = this.find(sb.toString(), params, null);
      if(units != null && units.size()>0){
        for (Unit unit : units) {
          Map<String, Object> map = new HashMap<>();
          map.put("name", unit.getEquipAlias());
          map.put("id", unit.getId());
          dataList.add(map);
        }
      }
      return dataList;
    }
    //action代码
    
    public void getUnits() throws UnsupportedEncodingException {
      ITakePointsMap pointsMap = (ITakePointsMap) this.getMap();
      List<Map<String, Object>> units = pointsMap.findUnits(URLDecoder.decode(equiptext,"UTF-8"));
      JSONArray jsonArray = JSONArray.fromObject(units);
      ResponseUtil.print(jsonArray.toString());
      
    }
  • 相关阅读:
    【jquery的setTimeOut定时器使用】
    python windows安装 SQLServer pymssql,
    python csv文件转换成xml, 构建新xml文件
    python 修改xml文档 ing
    python XML文件解析:用ElementTree解析XML
    python XML文件解析:用xml.dom.minidom来解析xml文件
    python range函数
    python 数据序列化(json、pickle、shelve)
    python 使用json.dumps() 的indent 参数,获得漂亮的格式化字符串后输出
    python 将一个JSON 字典转换为一个Python 对象
  • 原文地址:https://www.cnblogs.com/hnzkljq/p/10868081.html
Copyright © 2020-2023  润新知