web前端自动补全autocomplete

最新推荐文章于 2023-05-13 22:06:26 发布

vvion

最新推荐文章于 2023-05-13 22:06:26 发布

阅读量1.2k

点赞数

本文链接：https://blog.csdn.net/vvion/article/details/49870039

版权

这段内容展示了如何使用jQuery的autocomplete插件实现自动补全功能。通过设置serviceUrl、dataType、width等属性来定制搜索服务，transformResult函数用于解析返回的JSON数据，并在onSelect事件中处理选中的建议项，提交表单。此外，还扩展了一个getPageContent方法用于获取分页内容。

摘要由CSDN通过智能技术生成

$('#subjectTitle').autocomplete({
    serviceUrl: '/admin/activity/subject/listByName',

            dataType: 'json',
            width: $(this).attr('width'),//宽度
            scrollHeight: 300,   //提示的高度，溢出显示滚动条
            matchContains: true,    //包含匹配，就是data参数里的数据，是否只要包含文本框里的数据就显示
            autoFill: false,   //自动填充
            paramName: 'subjectTitle',
           transformResult: function(response) {
            return { suggestions:$.map(response.data, function(dataItem) {
                return {value: dataItem.title, data: dataItem.activitySubjectId};
            })};
          },
          onSelect: function (suggestion) {
               $("#page").val(1);
                 $("#subjectId").val(suggestion.data);
                  $("#searchForm").submit();

    }