DEV Community

Kevin Long
Kevin Long

Posted on • Updated on

Scanning user input and looking for keywords

Original post:

I am trying to load a json file as a javascript object. I then convert the keys into their own array. I am then trying to search through a user input string to find any matches. If a match is found I then want it to then check if the value of that key is "next" and if so do one thing. If the value is not "next" I want it to do a different thing. If none of the keys match any of the words in the user input string I want it to send an error message. This last part seems to be the issue. When a user types a string without a keyword it will sometimes log the error message more than once. I have noticed that this happens especially when a new json file is loaded. Here is a link to where I think the issue is. I have tried just about everything I can think of but every solution seems to have the same problem so maybe I am just looking in the wrong place. If you have any questions or need more information please let me know.

Edit:

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()

Latest comments (7)

Collapse
 
devdrake0 profile image
Si

Take a step back.

What are you trying to do? Can you provide some example data, and explain what should happen in a few different scenarios?

I looked at the link you provided, and there are so many levels of nesting going on.

Maybe it's needed, but without really understanding what you want it's hard to comment/help.

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.

Collapse
 
paxfeline profile image
David Newberry • Edited

I think what you need is a boolean flag. It would look something like this:

let noOptions = true;
for (i = 0; i < options.length; i++){
    if(text.search(options[i]) != -1){
        noOptions = false;
        ...
    }
}

and then after the loop you put a conditional:

if ( noOptions ){
    // no options matched
}

That conditional would replace the part inside the loop that starts with

else if (i == options.length-1)
Collapse
 
kevinuulong profile image
Kevin Long

I just tried that and did a little more testing; it seems that when I load the next json file as an object it ends up checking both of the two seperate files at once. Do you have any ideas as to how to fix that?