javascript - 在 javascript home 组件中定义 Apex Controller

Question

我创建了一个自定义对象Code_Postal__c。目标是检查我的 Code_Postal__c 记录的城市名称与用户在帐户记录页面上设置的相同邮政编码。

我不需要，也不想创建自定义 Visualforce 页面。

有趣的事实是，我的领域预先填充了良好的值(value)观，但研究不起作用。当我检查我的页面以检查自动完成功能不起作用的原因时，我收到以下错误:

**Uncaught ReferenceError: AutoCompleteController is not defined e?retURL=%2F001M000000UyrUl:24
j$.autocomplete.source e?retURL=%2F001M000000UyrUl:24
$.widget._search jquery-ui.js:6563
(anonymous function) jquery-ui.js:413
$.widget.search jquery-ui.js:6555
(anonymous function) jquery-ui.js:413
(anonymous function) jquery-ui.js:6536
handlerProxy**

这是我的 Controller :

global with sharing class AutoCompleteController {
//private final Movie__c mov; 
private Code_Postal__c cpCheck;
private Account accToCheck;

    // Instance fields
    public String searchTerm {get; set;}
    public String selectedMovie {get; set;}

    // Constructor
    public AutoCompleteController() {

    }
    public AutoCompleteController(ApexPages.StandardController stdController) {
    this.accToCheck = (Account)stdController.getRecord();
    //this.mov= (Movie__c)stdController.getRecord();
}

// JS Remoting action called when searching for a cp
@RemoteAction
global static List<Code_Postal__c> searchMovie(String searchTerm) {
    System.debug('Movie Name is: '+searchTerm );
    List<Code_Postal__c> movies = Database.query('Select Commune__c, Code_Postal__c from Code_Postal__c where Code_Postal__c like \'%' + String.escapeSingleQuotes(searchTerm) + '%\'');
    return movies;
}

}

这是我的组件:

    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.9.0/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css"/>
<script type="text/javascript">
    /*Create a new variable j$ just to avoid any conflicts with other libraries which may be using $.*/
    var j$ = jQuery.noConflict();
    /*Capture the list of countries in a Array.*/

    /*on Document ready*/
    j$(document).ready(function(){
        var PLACEHOLDER = 'Enter Code_Postal__c Here'; 
        var movieObjects;
        var queryTerm;

        j$('[id$=acc18zip]').autocomplete({
            minLength: 2,
            source: function(request, response) {
                        queryTerm = request.term;

                           AutoCompleteController.searchMovie(request.term, function(result, event){
                            if(event.type == 'exception') {
                                  alert(event.message);
                            } else {
                                 movieObjects = result;
                                 response(movieObjects);
                            }
                        });
                   },
            focus: function( event, ui ) {
                    j$('[id$=acc18zip]').val( ui.item.Code_Postal__c );
                    j$('[id$=acc18city]').val( ui.item.Commune__c );
                    return false;
                    },
            select: function( event, ui ) {
                        j$('[id$=acc18zip]').val( ui.item.Code_Postal__c );
                        return false;
                    },
         })

         .data( "autocomplete" )._renderItem = function( ul, item ) {
            var entry = "<a>" + item.Code_Postal__c + " " +item.Commune__c;

            entry = entry + "</a>";
            entry = entry.replace(queryTerm, "<b>" + queryTerm + "</b>");
            return j$( "<li></li>" )
                .data( "item.autocomplete", item )
                .append( entry )
                .appendTo( ul );
        };

        /* Add or remove placeholder values*/
        j$('[id$=acc18zip]').val(PLACEHOLDER);
        j$('[id$=acc18zip]').on("focus",  function(event){
            j$tgt = j$(event.target);
            if(j$tgt.val() === PLACEHOLDER ){
                j$tgt.val('');
                j$tgt.removeClass('placeHolder');
            }
        });
        j$('[id$=acc18zip]').on( "blur",  function(event){
            j$tgt = j$(event.target);
            if(j$tgt.val() === '' ){
                j$tgt.val(PLACEHOLDER);
                j$tgt.addClass('placeHolder');
            }
        });

    });
</script>  

Answer 1

正如我所说，我找到了一种自动完成的方法。它正在发出请求，并解析我的字符串。它不适用于参数..='(我正在尝试找到一种动态执行此操作并解析我的对象(使用该项目？)的方法不管怎样，这个例子是有效的:

Controller :

global class cpSearch2{ 
    webService static String searchCP() {
        String pickValues='';
        for(Code_Postal__c cp : [Select Commune__c, Code_Postal__c from Code_Postal__c ]){
               pickValues = pickValues +cp.Code_Postal__c+ ' - ' + cp.Commune__c+'+';
        }
        return pickValues;
    }
}

我的 JavaScript 组件:

<link rel="stylesheet" href="https://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="/soap/ajax/15.0/connection.js" type="text/javascript"></script>
<script src="/soap/ajax/15.0/apex.js" type="text/javascript"></script>
<script>var url = document.URL;
if(url.indexOf('001')!=-1)    
{                
    var sid = document.cookie.match(' sid=([^;]*)')[1];   
    sforce.debug.trace=true;
    sforce.connection.sessionId = sid;
    var stages = sforce.apex.execute("cpSearch2", "searchCP", {});
    var staheArray = stages.toString().split("+");
    $ = jQuery.noConflict();
    $(function() {
        var availableTags = staheArray;
        $( "#acc18zip" ).autocomplete({
            source: availableTags
            });
        $( "#acc18zip" ).on("autocompleteselect", function( event, ui ){
            selectedArray = ui.item.value.split(" - ");
            $("#acc18zip").val(selectedArray[0]);
            $("#acc18city").val(selectedArray[1]);
            return false;  
        });
    });
}
</script>