选择加载功能未在 html 中显示选项

Posted 2023-05-07

【中文标题】选择加载功能未在 html 中显示选项

【英文标题】：Selectize load function is not showing options in html

【发布时间】：2021-10-24 01:42:05

【问题描述】：

用例 我的数据库中总共存在 200000 条记录，如果我一次加载所有选项，页面根本没有加载，那就是说超过了最大事务时间（我觉得这是最糟糕的方法）。

我想加载基于关键字搜索的选择选项，我会在搜索关键字附近显示50条记录。 p>

我在后端（服务器端）中实现了搜索，它正确地将数据返回给客户端，但我没有找到将它们显示为 html 中的选项的方法。

Please find my code below:

$scope.$selectUser = $('#selectUser').selectize(
    valueField: 'sys_id',
    labelField: 'name',
    maxItems: c.data.maxteam,
    placeholder:"Enter names or select below",
    create: false,
    load: function (query, callback) 
    
        if (!query.length) return callback();
         
        $scope.data.funcName = 'getUsers';
        $scope.data.searchQuery = query;
        $scope.data.kudosTo = [];
        
        //Server call happens here
        c.server.update().then(function() 
             
            //Search data coming fine in this variable
            var results = c.data.activeUsers; 
            
            //??? AT this step i'm not what to do to appear the data as selectize options and select from them ??
            
            callback(results);
             
             
        );
    ,
    render: 
        option: function (item, escape) 
            return '<div class="option">' +
            '<div class="text">' +
            '<span class="name">' + escape(item.name) +"<i class='fa fa-circle circleFont'></i>"+ escape(item.user_name)  + '</span>' +
            '</div>' +
            '</div>';
        
    ,
);
$scope.selectizeControlUser = $scope.$selectUser[0].selectize; 

<div class="form-group text-left  clearfix">
    <select class="form-control" id="selectUser"  multiple></select>
</div>

在客户端代码中搜索数据正常：

问题：选择选项不显示在 HTML 视图中

预期结果：选项应如下图所示

【问题讨论】：

它给人的印象是你的 jQuery 插件没有达到标准。现在 javascript 开发得非常好（ES2021），让我感到惊讶的是这个插件会跟随更新，就像许多其他最终被放弃的 jQuery 插件一样。

@MisterJojo 我的插件没有问题，我 100% 确定！！我不只是清楚，如何使用load 函数进行选择将数据显示为选项。不幸的是，我们的开发环境（Servicenow）只支持 ES5，

【参考方案1】：

我自己想办法。

选项附加到选项，但只是不显示在视图中。

我添加了 searchField，它开始按预期正常工作。

searchField: ['name', 'email', 'user_name'],