1 Reply Latest reply: Feb 20, 2012 1:34 AM by BKBK RSS

    EnterKey in cfgrid

    kt03 Community Member

      I have the search form with three fields: city, state, and enter date.  The results are displayed in the cfgrid.  Currently, when i enter search criteria, i have to use the tab kep to refresh the data from the cfgird's results.  Instead of using the tab key, i need to use the enter key.  I don't know if i have the correct way but the code i have below didn't work because more arguments from cfgrid than cfc(i have extra the getSearchString () from cfgrid)

      can you help with this?

      Thanks

      -----------------------------

      <!---my cfc-->

      <cffunction name ="cf_city" access="remote" returnpe="struct">

           <cfargument name ="page" required="true" />

           <cfargument name = "pageSize" required="true" />

           <cfargument name ="gridsortcolumn" required="true" />

           <cfargument name ="gridsortdirection required="true" />

           <cfargument name="city" required="true" type="string" />

           <cfargument name ="state" required="true" type="string" />

           <cfargument name ="date" required="true" type="date" />

      </cffunction>

       

      <!---my form.cfm--->

      <cfform name="search" action="##" method="post" onsubmit ="ColdFusion.Grid.refresh("myGrid", false);">

      <cfinput type="text" name="city" id="city">

      <cfinput type="text" name="state" id="state">

      <cfinput type="datefield" name="date" id="date">

      </cfform>

       

      <!---scrpt function--->

      <script>

        getSearchString = function() {

         var s ={};

           s.city=ColdFusion.getElementValue("city");

           s.state=ColdFusion.getElementValue("state");

           s.date= ColdFusion.getElementValue("date");

      return s;

      </script>

       

      <!---diplay on the cfgrid--->

      <cfgrid

           name="myGrid"

           format="HTML"

           title="search result"

           selectMode="Single"

           pagesize= "20"

           bindOnLoad ="true"

          bind = "cfc.myapp.cfc.filter.cfc_city ({cfridpage},{cfgridpagesize},{cfgridsortcolumn},{cfgridsortdirection},getSearchString(), {city},{state};{date})">

           <cfgridcolumn name="city" header="city">

           <cfgridcolumn name="state" header="state">

      </cfgrid>

       

      thanks

        • 1. Re: EnterKey in cfgrid
          BKBK CommunityMVP

          kt03 wrote:

           

          I have the search form with three fields: city, state, and enter date.  The results are displayed in the cfgrid.  Currently, when i enter search criteria, i have to use the tab kep to refresh the data from the cfgird's results.  Instead of using the tab key, i need to use the enter key.  I don't know if i have the correct way but the code i have below didn't work because more arguments from cfgrid than cfc(i have extra the getSearchString () from cfgrid)

          can you help with this?

          Thanks

          -----------------------------

          <!---my cfc-->

          <cffunction name ="cf_city" access="remote" returnpe="struct">

               <cfargument name ="page" required="true" />

               <cfargument name = "pageSize" required="true" />

               <cfargument name ="gridsortcolumn" required="true" />

               <cfargument name ="gridsortdirection required="true" />

               <cfargument name="city" required="true" type="string" />

               <cfargument name ="state" required="true" type="string" />

               <cfargument name ="date" required="true" type="date" />

          </cffunction>

          Suggestions:

           

          <cfcomponent>

          <cffunction name ="cf_city" access="remote" returnpe="struct">

          <cfargument name ="page" required="true" />

          <cfargument name = "pageSize" required="true" />

          <cfargument name ="gridsortcolumn" required="true" />

          <cfargument name ="gridsortdirection" required="true" />

          <cfargument name="city" required="true" type="string" />

          <cfargument name ="state" required="true" type="string" />

          <cfargument name ="date" required="true" type="date" />    

          <!--- return at least an empty query to avoid errors,  enabling you to test --->

          <cfset var myQuery = querynew("")>    

          <cfreturn queryconvertforgrid(myQuery, page, pagesize) />

          </cffunction>

          </cfcomponent>

           

           

          <!---my form.cfm--->

          <cfform name="search" action="##" method="post" onsubmit ="ColdFusion.Grid.refresh("myGrid", false);">

          <cfinput type="text" name="city" id="city">

          <cfinput type="text" name="state" id="state">

          <cfinput type="datefield" name="date" id="date">

          </cfform>

           

          <!---scrpt function--->

          <script>

            getSearchString = function() {

             var s ={};

               s.city=ColdFusion.getElementValue("city");

               s.state=ColdFusion.getElementValue("state");

               s.date= ColdFusion.getElementValue("date");

          return s;

          </script>

           

          <!---diplay on the cfgrid--->

          <cfgrid

               name="myGrid"

               format="HTML"

               title="search result"

               selectMode="Single"

               pagesize= "20"

               bindOnLoad ="true"

              bind = "cfc.myapp.cfc.filter.cfc_city ({cfridpage},{cfgridpagesize},{cfgridsortcolumn},{cfgridsortdirection },getSearchString(),{city},{state};{date})">

               <cfgridcolumn name="city" header="city">

               <cfgridcolumn name="state" header="state">

          </cfgrid>

           

          Suggestions:

          1) Place the closing form tag </cfform> after the grid.

          2) Give the datefield a default value.

          3) Begin the bind expression with "cfc:", not "cfc.".

          4) Correct the spelling of the name of the function in the bind. It is "cf_city", not "cfc_city".

          5) Remove getSearchString() from the arguments list in the bind.

          6) Replace the semicolon in {state};{date} with a comma.

           

          The result should be something like

           

          <cfform name="search" action="##" method="post" onsubmit ="ColdFusion.Grid.refresh('myGrid', false);">

              <cfinput type="text" name="city" id="city">

              <cfinput type="text" name="state" id="state">

              <cfinput type="datefield" name="date" id="date" value="#now()#">

           

              <cfgrid

                   name="myGrid"

                   format="HTML"

                   title="search result"

                   selectMode="Single"

                   pagesize= "20"

                   bindOnLoad ="true"

                   bind = "cfc:myapp.cfc.filter.cf_city({cfgridpage},{cfgridpagesize},{cfgridsortcolumn},{cfgridsor tdirection},{city},{state},{date})">

                   <cfgridcolumn name="city" header="city">

                   <cfgridcolumn name="state" header="state">

              </cfgrid>

          </cfform>