Passing array of query results to jQuery Autocomplete source attribute

问题

I'm struck up with an issue when tried to pass the query results to the jquery autocomplete's source attribute...

    <cfloop query="MyQuery">
      <cfset head=#ValueList(MyQuery.pname,",")#>
      <cfset head1=#listtoarray(head)#>
    </cfloop>

Here I want to send the head1 array to the jquery code, Jquery autocomplete code goes as follows..

    <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css" />
    <script>

    $(function() {
    var availableTags = head1;
    $("#k").autocomplete({
    source:availableTags
      });

  });


 </script>
 </cfif>

How to pass head1 to the availableTags

回答1:

First, your cfloop is doing nothing but running valuelist and listtoarray over and over with the same results. There's no point in putting that in a query loop. See the details on valueList

You can simply do something like this in your CF:

<cfset head=#ValueList(MyQuery.pname,",")#>
<cfset head1=#listtoarray(head)#>

ColdFusion has a nice function called toScript that

Creates a JavaScript or ActionScript expression that assigns the value of a ColdFusion variable to a JavaScript or ActionScript variable. This function can convert ColdFusion strings, numbers, arrays, structures, and queries to JavaScript or ActionScript syntax that defines equivalent variables and values.

To create your JS array using your CF array you can do the following:

$(function() {
    <cfoutput>var #ToScript(head1, "availableTags")#;</cfoutput>
    $("#k").autocomplete({
        source:availableTags
    });
});

The output of toScript looks something like

var availableTags =  new Array();
availableTags[0] = "something";
availableTags[1] = "something else";
availableTags[2] = "another something";
availableTags[3] = "even more something";

回答2:

I Used serializeJson to solve the issue..and you just gave me another good method... (toScript)...Thank You... :)

$(function() {
     <cfoutput>var states = <cfoutput>#serializeJson(head1)#</cfoutput>                                                                                             $("#k").autocomplete({
     source:availableTags
  });
  });

来源：https://stackoverflow.com/questions/14746809/passing-array-of-query-results-to-jquery-autocomplete-source-attribute

标签

jquery

coldfusion