select2的使用

• 簡單的模糊查詢方法如下

				<input name="product" type="text" id="product"/>
				
				if (data.productForms != null && data.productForms != '') {
                $.each(data.productForms, function (index, value) {
                    productArr.push(value.name);
                });
      
                $('#product').autocomplete({
                    source: productArr
                });
            }

• input含有value的模糊查詢方法如下：
  1. 方法1的方式如下，但是模糊查詢的方式好像沒有效果

$("#customerName").autocomplete({
                    source: function (request, response) {
                        response($.map(data.customerForms, function (item) {
                            return {
                                label: item.name,
                                value: item.customerId
                            }
                        }));
                    },
                    select: function (event, ui) {
                        $('#customerName').val(ui.item.label);
                        $('#customerId').val(ui.item.value);
                        return false;
                        // event.preventDefault();
                    }
                });

2. 方式2的方式是有效果的

function AutoCompleteForOrg(data,ele_name,ele_id, attr_id) {
    $(ele_name).autocomplete({
        minLength: 0,
        source: function (req, res) {
            var term = req.term.trim();
            var matcher = new RegExp($.ui.autocomplete.escapeRegex(term), "i");
            res($.map(data, function (el) {
                /!* Remove dashes from the source and compare with the term: *!/
                if (matcher.test(el.name || matcher.test(el[attr_id]))) {
                    $(ele_name).val(el.name);
                    $(ele_id).val(el[attr_id]);
                    return el;
                }
            }));
        },
        minChars: 0,
        max: 5,
        autoFill: true,
        mustMatch: true,
        matchContains: true,
        scrollHeight: 60,
        open: function (event, ui) {
            $('.ui-autocomplete').css('position', 'absolute');
        },
        focus: function (event, ui) {
            $(ele_name).attr('source', ui.item.source);
            return false;
        },
        select: function (event, ui) {
            $(ele_name).val(ui.item.name);
            $(ele_id).val(ui.item[attr_id]);
            console.log(ui.item[attr_id]);
            console.log(ele_id);
            return false;
        }
    }).data( "ui-autocomplete" )._renderItem = function(ul,item) {
        return $( "<li style='list-style:none;'>" )
            .append( "<a>" + item.name + "</a>" )
            .appendTo(ul);
    };

參考鏈接