input输入值模糊查询

部分代码不能公布，大家可以参考思路

需求：如下

根据输入的值进行模糊查询，前面的select值也会限制模糊查询，如果前面没有选择，默认为所有（如果不需要这个限制可以删除）。效果如下（select标签动态获取参考上一篇）

代码实现

前端

<!-- 查询条件 -->
    <div class="control-group inline">
        <label class="inline" style="width: 80px;">选择产品:</label>
        <select id="product" name="product" class="input-medium" style="width: 190px;"></select>
        <input id="productId" type="hidden"/>
    </div>
    <div class="control-group inline">
        <label class="inline" style="width: 80px;">参考渠道:</label>
        <input id="channelCodeQuery" name="channelCode" type="text"
               style="width: 200px;"/>
        <input id="channelId" name="channelId" type="hidden"/>
    </div>

$("#channelCodeQuery").click(function () { //渠道号模糊匹配
      var productName = $('#product').val();
      fuzzyMatching('channelCodeQuery', false, productName);
});

/**
 * @desc 模糊匹配单个渠道ID和渠道名
 * @param    {String}  ele 元素id
 * @param    {boolean}  是否进行匹配
 * @param    {String}  productName 产品名称
 */
function fuzzyMatching(ele, flag, productName) {
    if (productName == undefined || productName == "undefined" || productName == "" || productName == "null") {
        productName = "";
    }

    $('#' + ele).empty();
    $.ajax({
        type: 'post',
        url: ctx + '/web/channel/getChannelIdAndName',
        async: false,
        dataType: 'json',
        data: "flag=" + flag + "&productName=" + productName + "&t=" + new Date().getTime(),
        success: function (data) {
            var availableTags = [];
            for (var i = 0; i < data.length; i++) {
                availableTags.push(data[i]);
            }
            $('#' + ele).autocomplete({
                source: availableTags
            });
        }
    });
}

后端【省略接口】

controller层

	/**
	 * 获取渠道ID和渠道名
	 */
	@RequestMapping(value = "/getChannelIdAndName", method = RequestMethod.POST)
	@ResponseBody
	public List<String> getChannelIdAndName(HttpServletRequest request,
			HttpServletResponse response, boolean flag, String productName) {
		// 产品处理（过滤用户可见的产品，数据权限）
		List<String> visibleProduct = new ArrayList<>();
		if (flag) {
			UserVO user = super.getUser();
			List<ProductVO> products = user.getProducts();
			if (products.size() == 0) {
				visibleProduct.add("");
			} else {
				if (org.apache.commons.lang.StringUtils.isBlank(productName)) {
					for (ProductVO p : products) {
						visibleProduct.add(p.getCode());
					}
				}
			}
		}

		if (org.apache.commons.lang.StringUtils.isNotBlank(productName)) {
			visibleProduct.add(productName);
		}

		List<ChannelEntity> beans = channelService.getChannelIdAndName(visibleProduct);

		List<String> vos = new ArrayList<String>();
		if (!super.isEmpty(beans)) {
			for (ChannelEntity bean : beans) {
				String channelId = bean.getChannelId();
				String channelName = bean.getChannelName();
				vos.add(channelId + "(" + channelName + ")");
			}
		}
		return vos;
	}

service层

	@Resource
	private IChannelReadDao channelReadDao;
	@Override
	public List<ChannelEntity> getChannelIdAndName(List<String> visibleProduct) {
		return channelReadDao.getChannelIdAndName(visibleProduct);
	}

dao层

	@Resource
	private SqlSession sqlsessionRead;
	
	@Override
	public List<ChannelEntity> getChannelIdAndName(List<String> visibleProduct) {
		Map<String, Object> params = new HashMap<String, Object>();
		params.put("visibleProduct", visibleProduct);
		return sqlsessionRead.selectList("read.channel.getChannelIdAndName",params);
	}

mapper

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"  "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="read.channel">

	<select id="getChannelsByChannelIds" parameterType="java.util.Map" resultType="channelEntity">
		select ChannelId, ChannelName from Channels where  isValid = 1  
		<if test="productId != null and productId != ''">
			and ProductId = #{productId} 
		</if>
		<if test="channelIds != null and channelIds.size()>0">
			AND ChannelId in
			<foreach item="channelId" collection="channelIds" open="(" separator="," close=")">
				#{channelId}
			</foreach>
		</if>
	</select>
</mapper>