The Cache: Technology Expert's Forum
 
*
Welcome, Guest. Please login or register. September 18, 2019, 11:35:39 AM

Login with username, password and session length


Pages: [1]
  Print  
Author Topic: onkeypress delay odd issue  (Read 4494 times)
KaptainKrayola
Keeper of Pie
Global Moderator
Lifer
*****
Offline Offline

Posts: 994



View Profile WWW
« on: November 27, 2009, 01:19:11 PM »

So, i hijacked some JS to make it so that when you were typing in a field and stopped for 1 second it would then send out an ajax request to do a search against the DB and it seemed to work beautifully.  However, it seems now that its only triggering the onkepress event about every third keystroke.

for example, if i type a word then backspace once it doesn't fire off and do the magic but if i hit backspace two more times it does.  Also, if i highlight the whole word/phrase i typed in and hit delete or backspace same thing.  Very odd.

Here is the JS i have doing the business so if anyone sees something I don't or has some clue as to why this may be happening that would be awesome

Code:
   function addTextAreaCallback(textArea, callback, delay) {
       var timer = null;
       
       textArea.onkeyup = function() {
           if (timer) {
               window.clearTimeout(timer);
               if(!waiting){
                $("#results").html("<img src='img/ajax-loader.gif' />");
                 waiting = 1;
              }

           }
           timer = window.setTimeout( function() {
               timer = null;
               callback();
               waiting = 0;
           }, delay );
       };
       textArea = null;
   }
Logged

We can't stop here, this is bat country.
isthisthingon
Global Moderator
Lifer
*****
Offline Offline

Posts: 2879



View Profile
« Reply #1 on: November 27, 2009, 03:12:38 PM »

Looks like you're catching onkeyup, not onkeypress.  In any case, or if you tried onchange or onkeydown, this area get's quite hackey.  I'd try rerendering the section after each keystroke to keep it clean but the feel get's a little choppy when rerendering 

I've noticed with ajax that many events either don't happen because of timing issues or they're delayed and are trying to happen after other client/server rendering completes.  Is it also possible to flag this call to execute before or after the server method completes?  Not sure if this involves server round-trips but if you requerying the database I'll assume there's a server trip involved.

I've been pretty unsuccessful trying to do things like this in general (on keystrokes especially) so perhaps someone else would have a magic answer for ya  Undecided

For example, having a re-query button would "fix" everything...
Logged

I would love to change the world, but they won't give me the source code.
KaptainKrayola
Keeper of Pie
Global Moderator
Lifer
*****
Offline Offline

Posts: 994



View Profile WWW
« Reply #2 on: November 27, 2009, 03:19:37 PM »

yeah on that chunk i did have onkeyup  - apparently i was trying that instead of onkeypress which is how i had it originally.

i have been screwing with it for a little bit now and it seems what is actually happening is that *sometimes* the line that sets the div to the loading image                 $("#results").html("<img src='img/ajax-loader.gif' />");

is whats not working right.  If i, for example, highlight and delete all the text in the text input then wait a second it does do what its supposed to as far as the ajax call is concerned it just doesn't load up the wait image whjile it's doing it.

it will also do it if i clear out the box and enter just an "a"  - no loading image but it does do the ajax  call.  very odd.  timing issue is what it seems to be.  boooooooo
Logged

We can't stop here, this is bat country.
KaptainKrayola
Keeper of Pie
Global Moderator
Lifer
*****
Offline Offline

Posts: 994



View Profile WWW
« Reply #3 on: November 27, 2009, 03:38:53 PM »

nevermind, i am a dipshit today.  i had to move the code that sets the wait image out of the if() for the timer.  works like a champ now.
Logged

We can't stop here, this is bat country.
isthisthingon
Global Moderator
Lifer
*****
Offline Offline

Posts: 2879



View Profile
« Reply #4 on: November 27, 2009, 03:48:28 PM »

nevermind, i am a dipshit today.  i had to move the code that sets the wait image out of the if() for the timer.  works like a champ now.

 ROFLMAO  Thanksgiving binge blunder perhaps?   Tongue  Glad it works like a champ now.
Logged

I would love to change the world, but they won't give me the source code.
jammaster82
Lifer
*****
Offline Offline

Posts: 666


Thats craigs list for ya


View Profile
« Reply #5 on: November 27, 2009, 05:31:58 PM »

nevermind, i am a dipshit today.  i had to move the code that sets the wait image out of the if() for the timer.  works like a champ now.

??

can you please post the new code that works... this is awesome!!!
Logged

The watched pot, never boils... But if you walk away from it , the soup burns.  What gives?
KaptainKrayola
Keeper of Pie
Global Moderator
Lifer
*****
Offline Offline

Posts: 994



View Profile WWW
« Reply #6 on: November 27, 2009, 05:46:32 PM »

Sure thing - here you go:

Code:

   function addTextAreaCallback(textArea, callback, delay) {
       var timer = null;
       
       textArea.onkeyup = function() {
           if (timer) {
               window.clearTimeout(timer);
           }
            if(waiting == 0){
                $("#results").html("<img src='img/ajax-loader.gif' />");
                 waiting = 1;
              }
           timer = window.setTimeout( function() {
               timer = null;
               callback();
               waiting = 0;
               timer = null;
           }, delay );
       };
       textArea = null;
   }

Keep in mind the line:
Code:
$("#results").html("<img src='img/ajax-loader.gif' />");
is using jQuery so if you aren't using jQuery that line wont work - will tell you something about "$ is not defined".  You'll want to use your preferred method for setting the innerHTML of the div with the IMG tag.
Logged

We can't stop here, this is bat country.
isthisthingon
Global Moderator
Lifer
*****
Offline Offline

Posts: 2879



View Profile
« Reply #7 on: November 27, 2009, 08:17:11 PM »

 Applause

Nice code.
Logged

I would love to change the world, but they won't give me the source code.
Pages: [1]
  Print  
 
Jump to:  

Perkiset's Place Home   Best of The Cache   phpMyIDE: MySQL Stored Procedures, Functions & Triggers
Politics @ Perkiset's   Pinkhat's Perspective   
cache
mart
coder
programmers
ajax
php
javascript
Powered by MySQL Powered by PHP Powered by SMF 1.1.2 | SMF © 2006-2007, Simple Machines LLC
Seo4Smf v0.2 © Webmaster's Talks


Valid XHTML 1.0! Valid CSS!