Question

我一直在尝试使用带有ColdFusion的jQuery作为数据源创建自动完成。我在stackoverflow上使用了其他场景，但它似乎没有用。我可以将结果显示在firebug中，但在输入3个字符后，自动完成值不会显示。

这是我的CFC：

<cfcomponent>
    <cffunction name="lookupOrg" access="remote" returntype="String" >
        <cfargument name="search" type="any" required="false" default="">

        <!--- Define variables --->
        <cfset var data="">
        <cfset var result=ArrayNew(1)>

        <!--- Do search --->
        <cfquery name="data">
            SELECT name
            FROM org
            WHERE lower(name) LIKE '#ARGUMENTS.search#%'
            ORDER BY name
        </cfquery>

        <!--- Build result array --->
        <cfloop query="data">
            <cfset returnStruct = StructNew() />
            <cfset returnStruct["label"] = name />

            <cfset ArrayAppend(result,returnStruct) />
        </cfloop>

        <!--- And return it --->
        <cfreturn serializeJSON(result) />
    </cffunction>
</cfcomponent>

这是我的jQuery＆amp; HTML：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>Untitled</title>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>

    <script>
        $(document).ready(function() {
          $('#Org').autocomplete({
            source: function(request, response) {
              $.ajax({
                url: "getData.cfc?method=lookupOrg&returnformat=json",
                dataType: "json",
                data: {
                  search: request.term,
                  maxRows: 10
                },
                success: function(data) {
                  response(data);
                }
              });
            },
            parse: function(data) {
              return $.map(data, function(item) {
                return {
                  data: item,
                  value: item,
                  result: item
                };
              });
            }
          });
        });
    </script>
</head>
<body>
    <div class="row">   
        <div class="span9">
            <input size="34" type="text" name="Org" id="Org" value="" />
        <div id="results"></div>
        </div>
    </div>
</body>
</html>

当我输入“tes”时，这就是Firebug中显示的内容，但自动完成没有显示任何值。任何帮助都会很棒！

[{“label”：“TEST，L.L.C”}]

Answer 1

我认为您使用了jQueryUI的自动完成小部件，因为您需要使用jQuery UI。我不认为它有parse选项或方法或事件（1）（http://api.jqueryui.com/autocomplete/）。因此，您的jQuery代码应如下所示：

        $('#Org').autocomplete(
            {source: function(request, response) {
                $.ajax({
                    url: "getData.cfc?method=lookupOrg&returnformat=json",
                    dataType: "json",
                    data: {
                    search: request.term,
                    maxRows: 10
                },
                success: function(data) {
                  response($.map(data, function(item) {
                     return { label: item.label, value: item.label };
                  }));
                }                   
            })
         }
      });

如果您只传输一系列名称，那么您的网络会更容易吗？

    <cfloop query="data">
        <cfset ArrayAppend(result, name) />
    </cfloop>

使用ColdFusion的Jquery自动完成不显示结果

1 个答案: