一、效果展示:
下面输入供应商名称:
二、代码实现:
1.第一种方式:直接在标签的data-options属性里面写上Url:
<td>供应商:<input class="easyui-combobox" id="supplierId" name="supplier.id" style="width: 200px" required="true" data-options="required:true,panelHeight:'auto',valueField:'id',textField:'name',url:'/admin/supplier/comboList'"/></td>
2.第二种方式:
$(document).ready(function(){
//第二种方式
$("#supplierId").combobox({
mode:'remote',
url:'/admin/supplier/comboList',
valueField:'id',
textField:'name',
delay:100
});
});
3.controller:
/**
* 下拉框模糊查询
* @param q
* @return
* @throws Exception
*/
@RequestMapping("/comboList")
//@RequiresPermissions(value={"进货入库","退货出库","进货单据查询"},logical=Logical.OR)
public List<Supplier> comboList(String q) throws Exception{
if(q==null) {
q="";
}
return supplierService.findByName("%"+q+"%");
}
4.ServiceImpl:
@Override
public List<Supplier> findByName(String name) {
return supplierRepository.findByName(name);
}
5.Repository
/**
* 供应商Repository接口
* @author Administrator
*
*/
public interface SupplierRepository extends JpaRepository<Supplier, Integer>,JpaSpecificationExecutor<Supplier>{
/**
* 根据名称模糊查询供应商信息
* @param name
* @return
*/
@Query(value="select * from t_supplier where name like ?1",nativeQuery=true)
public List<Supplier> findByName(String name);
}
6.用到的jquery资源文件地址:
链接:https://pan.baidu.com/s/14vfYeUKzGH5uff2rBANxqA
提取码:p2nm