DEV Community

Discussion on: Scanning user input and looking for keywords

Collapse
 
kevinuulong profile image
Kevin Long • Edited

I have an object that looks like this:

var object = {"keyword": "next", "other word": "wrong", "test": "wrong"}

it was loaded from a json file accessed from the server using the fetch API. I then have an input box that when a user enters one of the three keys of the object should echo its value on enter. If no keys are found in the string the user has input it should print out an error message. If the value of the key is "next" it should run a function called loadlevel() to load the next level. That next level is then loaded in the same way as the aforementioned one. This appears to be where I am having issues. When it loads the new json file it seems that both the previous object and the new object are still running. This causes it to print out the error message if the new input doesn't match both the new keys. See example below:

Setup:

//This is the first object loaded from the json file:
var object = {"keyword": "next", "other word": "wrong", "test": "wrong"}

What Should happen

When the user inputs the following strings it should have the corresponding outputs:

"this is the other word" => "wrong"
"hello, world" => "error"
"this is the keyword" => "next" loadlevel()

When the next level is loaded, say this for example:

var object = {"smith": "next", "hello": "wrong", "hi there": "wrong"}

It should then output this:

"this is the other word" => "error"
"hello, world" => "wrong"
"this is smith" => "next" loadlevel()

What is happening

The first values seem to work fine:

"this is the other word" => "wrong"
"hello, world" => "error"
"this is the keyword" => "next" loadlevel()

When the next level is loaded, say this for example:

var object = {"smith": "next", "hello": "wrong", "hi there": "wrong"}

It then outputs this:

"this is the other word" => "error" "error"
"hello, world" => "wrong" "error"
"this is smith" => "next" "error" loadlevel()

I have updated the original post with this information too.

Collapse
 
devdrake0 profile image
Si

I just realised I replied to my comment, so don't know if you get a notification about the reply - it's here just in case.

Collapse
 
devdrake0 profile image
Si

I'm probably going to have to clone your repo down to try and help you debug this properly, so you'll have to bare with me 🙂

Thread Thread
 
devdrake0 profile image
Si

So I'm pretty sure your issue is that your registering event handlers, but you're never de-registering them.

On the first page:

getEventListeners(document)
{keyup: Array(1)}

When I move onto the next section:

getEventListeners(document)
{keyup: Array(2)}

etc etc.

I believe this is why you're having problems.