Skip to main content
Participant
April 1, 2010
Question

Need Cfdiv bind@keypress delay

  • April 1, 2010
  • 3 replies
  • 2212 views

Is there a method to delay a cfdiv bind @11000911?

I need to wait until user has finished typing so the ajax queries are not executed with each keystroke.

<cfform>
<cfinput type="text" name="search" />
</cfform>

//on keyup get the list of names based on cfinput search value.
<cfdiv bind="url:mycfm.cfm?search={search@keyup}"   id="myDiv" />

Thanks in advance.

eSearing

    This topic has been closed for replies.

    3 replies

    Participant
    March 3, 2013

    googling i found the solution from another forum from the author of the post

    this is correct and works fine.!

    thanx esearing

    ***** correct javascript code *****

    <script language="javascript>

    //uses jquery

    var t = 0;

    function keep_focus(){

    //clear timeout so it does not execute multiple times.

    clearTimeout(t);

    //set focus

    $("#search").focus();

    //set timer for doBlur execution.

    t=setTimeout('doBlur()',2000);

    }

    function doBlur( ){

      //alert("blurred");

       $("#search").blur();

    }

    </script>

    esearingAuthor
    Participant
    March 4, 2013

    @harlock_74

    One more thing you might want to consider for search is that some users may also cut/paste into your search field. So you may need to trigger an onPaste event too. Here is mine, but I haven't looked at it in years so may need updating. I only have to develop for MSIE  (company standard issue) so not sure if compatible in all browsers.

    onpaste="doBlur();"// or can use keep_focus() if you wish to remain consistent.

    Participant
    March 3, 2013

    unfortunatly your method works only to delay the keystroke, but anyway the number of request you do to the database is the same numebr of the keys stroked and of curse you do many times the same query.

    esearingAuthor
    Participant
    March 3, 2013

    @harlock_74,  I do not think you are correct. While the "search" input has focus the cfdiv bind (call to cfc) is not occurring. It only occurs onBLUR {search@blur}.  I also had in the cffunction a minimum number of chraracters to execute the query. 

    This is similar to allowing the user to input the search terms then hit a dummy button to take the focus off of the search input.  Or user could hit enter or tab.

    Current versions of Coldfusion now offer auto-suggest (which does do multiple db hits).

    ilssac
    Inspiring
    April 1, 2010

    I have not yet played with the <cfdiv...> functionality so I don't know how this advice jives with that feature.

    But from a JavaScript perspective (Which is what really powers functionality like this, ColdFusion just builds the JavaScript for you), you would be looking to use the onChange or onBlur events rather then the onKeyPress event if you don't want the event to fire every keystroke.

    esearingAuthor
    Participant
    April 1, 2010

    Thanks, that got my wheels spinning and I came up with  a solution.

    Added this bitof Javascript

    function keep_focus(){
        $("#search").focus();
        setTimeout('doBlur()',2000);
    }

    function doBlur( ){
       $("#search").blur();
       $("#search").focus();
    }

    Then revised the form element to call keep_focus() onKeyUp  and changed the bind fuction to execute onBlur.

    <cfform>

    <cfinput type="text" name="search" id="search" onKeyUp="keep_focus();" />

    </cfform>

    <cfdiv bind="url:get_namelist.cfm?search={search@blur}" id="myDiv" /