<link rel="stylesheet" type="text/css" href="~/lib/jquery.tagsinput.jurgenscope/jquery.tagsinput.css" /> ...
<link rel="stylesheet" type="text/css" href="~/lib/jquery.tagsinput.jurgenscope/jquery.tagsinput.css" />
<link rel="stylesheet" type="text/css" href="~/lib/jquery-ui/themes/ui-lightness/jquery-ui.min.css" />
<script type="text/javascript" charset="utf-8" src='/images/loading.gif' data-original="~/lib/jquery-ui/jquery-ui.min.js"></script>
<script type="text/javascript" charset="utf-8" src='/images/loading.gif' data-original="~/lib/jquery.tagsinput.jurgenscope/jquery.tagsinput.js"></script>
<script type="text/javascript">$(function () {$('#Employees').tagsInput({'autocomplete_url': 'http://www,xxx,cin/AutoComplete', 'height': '60px', //设置高度'width': '400px', //设置宽度'defaultText': '添加被投诉人','removeWithBackspace': false,//禁止退格删除onAddTag: function (tag) {//alert('增加了' + tag)},onRemoveTag: function (tag) {//alert('删除了' + tag)}});})</script>
要使用autocomplete_url 必须 引入jquery.ui
<link rel="stylesheet" type="text/css" href="~/lib/jquery-ui/themes/ui-lightness/jquery-ui.min.css" />
<script type="text/javascript" charset="utf-8" src='/images/loading.gif' data-original="~/lib/jquery-ui/jquery-ui.min.js"></script>
该链接在模糊查询时会自动提交 term 参数
后台接收函数例子如下:
public async Task<ActionResult> AutoComplete(string term = ""){ var list = await elyService.GetListAsync(0, Predicates.Field<Employee>(a => a.RealName, Operator.Like, "%" + term + "%")); List<Object> models = new List<Object>(); foreach (var model in list) { models.Add(new { label = model.RealName, value = model.Id + "." + model.RealName }); } return Json(models);}
原标题:jquery.tagsinput的使用例子,包括模糊查询后端代码
关键词:jquery
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。