javascript - 如何调用查询回调数据到数据属性select2

Question

$('#placeSelect').select2({
    width: '100%',
    allowClear: true,
    multiple: true,
    maximumSelectionSize: 1,
    placeholder: "Click here and start typing to search.",
     data: function(query) {
     queryData{!randomJsIden}(query);
     },
     matcher: function (term, text) {if (text.toUpperCase().indexOf(term.toUpperCase()) == 0){return true;}return false;}
     });


        function queryData{!randomJsIden}(query){
           Visualforce.remoting.Manager.invokeAction(
       '{!$RemoteAction.AutoCompleteV2_Con.getData}','{!sObjVal}','{!labelFieldVar}','{!valueFieldVar}',query.term,
                     function(result, event){
                      //if success
                         if(event.status){ 
                            var data = {results:[{ id: 1, text: "Ford"     },
            { id: 2, text: "Dodge"    },
            { id: 3, text: "Mercedes" },
            { id: 4, text: "Jaguar"   }]}
                             query.callback( data);                           
                         }   
                     }, 
                      {escape: true}
                );
            } 
    </script>

如何在 select2 中初始化查询回调数据到 data 属性。 我无法直接使用数据。在上面的示例中，我使用的是示例数据。

query : function(query){
     queryData{!randomJsIden}(query);
     }

我想用这样的数据属性替换它:下面的属性不起作用

data : function(query){
     queryData{!randomJsIden}(query);
     }

这是 fiddle :

http://jsfiddle.net/Lnf8j/303/

让我知道你的任何想法

Answer 1

您的代码中有几个问题

1. 您不能使用花括号来命名函数，因为它是 javascript function queryData{!randomJsIden}(query) 中的保留符号，而是将其命名为 function queryData(query){ 。 .. }

2. 如果您为 select2 的数据添加回调，那么您需要返回由 queryData() 函数构造的数据。

   data: function(query) {
     return queryData(query);
   },
   function queryData(query){
      ...
      return data;
   }
   

3. 如果我没记错的话，数据是通过 queryData() 内部的异步调用获取到 select2 的，这意味着数据会在不可预测的时间返回，因此，您需要限制用户访问 select2 组件，直到向其提供数据。 这意味着您需要预取数据或禁用 select2 字段，直到从远程调用返回数据。

Working Demo @ JSFiddle