3 Replies Latest reply on Mar 18, 2010 10:49 AM by Fernis

    Filtering cfselect data


      I have built a crud flash form.  In the form I have a cfselect that is populated by several hundred teachers.  I'm looking for an easy way to select a teacher.  If you click on the dropdown and type "s" it takes you to the first record beginning with "s".  What I would like to do is make it so that you can start typing a name and it filters out the data so that is the only data avaialbe in the dropdown.


      Anybody know if this is possible or know of a better solution?



        • 1. Re: Filtering cfselect data
          Fernis Level 3

          Yup, it's possible and better yet, easy! [insert all kinds of disclaimers here]


          You can bind CFSELECT to a .cfc component which returns the options you want.

          And you can give the .cfc an argument, which is the value of a search box.






          <cfform name="form1">
              <cfinput type="text" name="searchterm">
              <cfselect name="myoption" bind="cfc:queryoptions.search({form1:searchterm})"

          bindonload="true" value="mytext"></cfselect>




          <cfcomponent >
              <cffunction name="search" returnformat="json" access="remote" >
                  <cfargument name="searchterm">
                  <cfset q = queryNew("myvalue,mytext","varchar,varchar")>
                  <cfloop from="65" to="90" index="c">
                  <cfset queryAddRow(q)>
                  <cfset querySetCell(q,"myvalue",c)>
                  <cfset querySetCell(q,"mytext",lcase(repeatstring(chr(c),5)))>
                  <cfquery name="qoq" dbtype="query" >
                  SELECT myvalue,mytext FROM q
                  <cfif trim(arguments.searchterm) neq "">
                  WHERE lower(mytext) LIKE '#lcase(arguments.searchterm)#%'
                  <cfreturn qoq>


          There you go. A working example.


          The .cfc is unnecessarily long, because I first created query data from scratch. 25 rows, values from AAAAA, BBBBB to ZZZZZ. Then I emulate the "real" query (you're going to have) by doing a QueryOfQuery of the querydata (representing the data in your database).


          In real life, you just need one query. Make sure your search is case insensitive (as I did in the example).


          Hope this helps with ColdFusion bindings. They rule.


          Edit: the select does not re-populate before the search field unfocuses. This would do the trick:  onkeyup="this.blur();this.focus();" but it's really an awful haxx, and is not guaranteed to work correctly at all. There should be a better way to do this, but I haven't checked if and how BINDs can be activated "remotely" from javascript.



          -Fernis - fernis.net - ColdFusion Developer For Hire

          1 person found this helpful
          • 2. Re: Filtering cfselect data
            LogicBlast Level 1



            Thanks for the code.  It does exactly what I'm looking for it to do.  Cool stuff!  However, when I use your code on test pages it works great, but when I insert it into my flash form, the dropdown never populates.


            I copied/pasted the searchbox and cfselect from the test page and inserted it directly into my flash form.  The form name is exactly the same.


            Any Ideas?



            • 3. Re: Filtering cfselect data
              Fernis Level 3

              Unfortunately Binding is not suppored for CFSELECT in Flash forms.


              I don't use flash forms myself. but http://www.asfusion.com/blog/entry/how-to-populate-a-cfselect-with-flash might help you out, if you must use flash.


              Also, you might need http://help.adobe.com/en_US/ColdFusion/9.0/Developing/WSc3ff6d0ea77859461172e0811cbec22c24 -7c4b.html


              It does get complicated.