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

    Filtering cfselect data

    LogicBlast

      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?

       

      Thanks!

        • 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.

           

          Example:

           

          test.cfm

           

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

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

           

          queryoptions.cfc

           

          <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)))>
                  </cfloop>
                 
                  <cfquery name="qoq" dbtype="query" >
                  SELECT myvalue,mytext FROM q
                  <cfif trim(arguments.searchterm) neq "">
                  WHERE lower(mytext) LIKE '#lcase(arguments.searchterm)#%'
                  </cfif>
                  </cfquery>
                 
                  <cfreturn qoq>
              </cffunction>
          </cfcomponent>

           

          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

            Fernis,

             

            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?

             

            Thanks

            • 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.

               

              -Fernis