javascript - Select2 JS 不显示来自 AJAX 的数据

Question

我尝试使用 select2 js 最新版本来获取 ajax 结果，但出现以下错误:

jQuery.Deferred exception: Cannot read property 'results' of undefined
TypeError: Cannot read property 'results' of undefined

我使用的 jQuery 版本:jquery-3.2.1.min

我正在使用的 Bootstrap 版本:4

这是我的代码:

$(document).ready(function(){
    		$('#category').select2({
    			placeholder: 'Subjects',
    			minimumInputLength: 3,
    			allowClear: true,
    			ajax:{
    				url: "<?php echo base_url(); ?>library/ajax-categories",
    				dataType: "json",
    				delay: 250,
    				data: function(params)
    				{
    					return{
    						search: params.term,
    						type: 'public'
    					};
    				},
    				processResults: function(data, page)
    				{
    					var newResults = [];

    					$.each(data, function(index, item)
    					{
    						newResults.push({
    							id: item.CategoryID,
    							text: item.CategoryName
    						});
    					});
    					return
    					{
    						results: newResults
    					}
    				}
    			}
    		});
    	});

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<select class="select2 form-control" name="category[]" id="category" placeholder="Choose Subjects" multiple>
    </select>

我从服务器端脚本得到的响应:

[
 {"CategoryID":"1","CategoryName":"A Name"},
 {"CategoryID":"2","CategoryName":"B Name"},
 {"CategoryID":"3","CategoryName":"C Name"}
] 

我将以下响应转换为 select2 模式，即“id, text”，正如您在我的 JS 代码中看到的那样。

请帮助我解决此错误。

Answer 1

看起来像是语法问题。重新格式化 processResults 函数的返回语句，如下所示。问题出在 return 语句上。

  return {
      results: newResults,
  };

JS 引擎会将你的语句转换为:

return;
{
   results: newResults 
}

其他信息 here和 here