typeahead经典下拉框提示

--------------------js接口--------------------------------

//查询公司客户
$scope.A = [];
DataCenter.find("customer/info",{COMPANY:1})
DataCenter.addEventListener("customers", function(e){
$scope.A = e.data;
$scope.$apply();
});
if($('#C') != null){
$('#C').typeahead({source:
function() {
return $scope.A;
}
});
}

--------------------后端控制器--------------------------------
@RequestMapping(value = "/info", method = RequestMethod.GET)
public Object require(@RequestParam(required = false) Map m){
return DataEvent.wrap("customers", customerService.require(m));
}

service---public String[] require(Map<String, String> m);

impl----@Override
public String[] require(Map<String, String> m){
List list = customerDao.require(m);
int size = list.size();
if(size <= 0){
return new String[]{};
}

ArrayList al = new ArrayList();
for(int i = 0; i < size; i++){
Map c = (Map)list.get(i);
String cid = c.get("CID").toString();
String cname = c.get("CNAME") == null ? "" : c.get("CNAME").toString();
// al.add(cid + "/" + cname); //客户姓名模糊查询 不带编号
al.add(cname);
//al.add(cname+ "/" +cid);
al.add(cid);
}
String[] s = new String[size];
return (String[])al.toArray(s);
}

dao----//取公司用户
public List<Map<String, String>> require(Map<String, String> m);

--------------------ORM映射文件--------------------------------

mapper--<select id="require" parameterType="java.util.Map" resultMap="Customers">
SELECT
<include refid="columns"/>
from CUSTOMERS
<where>
COMPANY=#{COMPANY, jdbcType=NUMERIC} AND BLACK=0
</where>

--------------------html5部分--------------------------------

<div class="col-md-7 col-sm-7 control-btm control-label" style="text-align:left;">
<input type="text" class="control-btm input-sm form-control" id="C" value="" data-provide="typeahead" data-items="20" ng-model="nameId" ng-blur="getName()"/>
<input type="hidden" class="" id="CID" ng-model="cId"/>
</div>

原文地址:https://www.cnblogs.com/shunzdd/p/5585965.html