Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Oct 2013
    Posts
    23
    Thanks
    6
    Thanked 0 Times in 0 Posts

    comparing users input with string arrays

    In this piece of code I'm trying to get input from a user and compare it with a string array to see if it matches. If it does it then returns information to the user in the form of an output function. I've been stuck in one way or another for some time now and have been getting discouraged. If anyone can help I would appreciate it. Thanks

    HTML :

    Code:
    <!DOCTYPE html>
    <html>
    <head>
     <title> loading...econ</title>
     <meta charset="utf-8" >
     
     <link rel="stylesheet" type="text/css" href="econstyle.css">
     <meta name="viewport" content="width=device+width, initial-scale=1.0">
     
    </head>
    
    <body>
    
        <div id="wrap">
            <div id="game">
                <div id="console"></div>
                <div id="gamelog">
    			<form id="form">
    				Console: <input id="inputConsole" type="text"></input>
    			
    				<input type="button" onclick="indexConsole.checkInput(userInput.value)" value="Send"> </input>
    			
    			</form> 
    			
    			</div>
                
            </div>
        
    	</div>
    	<script type="text/javascript" src="econ.js"></script>
    </body>
    
    </html>
    JS :

    Code:
    var realOutput = document.getElementById("console").innerHTML,
        acceptConsole = ["char", "start", "attack", "info", "help"],
        userInput = document.getElementById("inputConsole"),
        i = 0;
    
    function verifyInput(input) {
        if (input === acceptConsole.valueOf[i]) {
            return acceptConsole.valueOf[i];
        } else {
            i = i + 1;
        }
    }
    clearOutput(); {
        document.getElementById("console").innerHTML = "";
    }
     output(params); {
        document.getElementById("console").innerHTML += params + "<br />";
    }
     updateInput(params); {
        userInput.value = params;
    }
    
    var indexConsole = {
        checkInput: function (input) {
            var check = acceptConsole.every(verifyInput(input));
            if (check !== "") {
                output(check);
            }
        }
    };
    CSS :

    Code:
    body {
    	background-color: #E0E0E0;
    }
    #wrap {
    	margin : 0 auto;
        width: 80%;
        height: 0 auto;
    }
    #game {
    	position:relative;
    	width: 90%;
        height: 600px;
        margin: 0 auto;
    }
    #console {
    	background-color: #E0E0E0;
    	position: absolute;
    	right: 425px;
    	bottom: 100px;
    	background-color:white;
        width: 700px;
        height: 400px;
        float:left;
        border: 2px black solid;
        border-radius:10px;
        -moz-border-radius:10px;
    	padding: 10px;
    }
    #gamelog {
    	padding: 10px;
    	background-color: #E0E0E0;
    	position: absolute;
    	right:25px;
    	bottom:100px;
        background-color: white;
        width: 200px;
        height: 400px;
        float: left;
        border: 2px black solid;
        border-radius: 10px;
        -moz-border-radius:10px;
    }
    Last edited by codessential; 11-17-2013 at 11:10 PM.

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,155
    Thanks
    75
    Thanked 4,338 Times in 4,304 Posts
    There are so many things wrong I don't know where to start.

    Just for starters, where did you find that valueOf method? acceptConsole.valueOf[i]

    It's not a standard method on a String instance in any system I have seen. If it's part of some library akin to jQuery, then where is the library?

    But then this code makes no sense, either:
    Code:
    clearOutput(); {
        document.getElementById("console").innerHTML = "";
    }
     output(params); {
        document.getElementById("console").innerHTML += params + "<br />";
    }
     updateInput(params); {
        userInput.value = params;
    }
    You have WRITTEN it to make it look like you are defining a set of functions. But nothing could be further from the truth.

    Your code is *ACTUALLY* doing this:
    Code:
    clearOutput();
    document.getElementById("console").innerHTML = "";
    output(params); 
    document.getElementById("console").innerHTML += params + "<br />";
    updateInput(params); 
    userInput.value = params;
    That is, you are *CALLING* the UNDEFINED FUNCTION clearOutput and *THEN* assigning "" to the innerHTML of "console", etc., etc.

    Quite honestly, it looks to me like you have taken a bunch of code and thrown it a the wall and hoped that some of it sticks. I'd be more than happy to be proven very very wrong, but at this point, at least, I can't make sense of any of that.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    New Coder
    Join Date
    Oct 2013
    Posts
    23
    Thanks
    6
    Thanked 0 Times in 0 Posts
    That's certainly not the case. In reference to my valueOf method. I didn't find it anywhere, I'm just trying to make it work and that is what my logic told me to try. I've been looking around a bit but I can't seem to find out how i can refer directly to the different values within my array.

    Code:
    var realOutput = document.getElementById("console").innerHTML,
        example = "hello",
        acceptConsole = ["char", "start", "attack", "info", "help"],
        userInput = document.getElementById("inputConsole"),
        i = 0;
    var indexConsole = {
        checkInput: function (input) {
            var check = acceptConsole.every(verifyInput(input));
            if (check !== "") {
                output(check);
            }
        }
    };
    
    function verifyInput(input) {
        if (input === acceptConsole.valueOf[i]) {
            return acceptConsole.valueOf[i];
        } else {
            i = i + 1;
        }
    };
    
    function clearOutput() {
        document.getElementById("console").innerHTML = "";
    };
    
    function output(params) {
        document.getElementById("console").innerHTML += params + "<br />";
    };
    Last edited by codessential; 11-18-2013 at 12:48 AM.

  • #4
    Regular Coder
    Join Date
    Aug 2010
    Posts
    966
    Thanks
    19
    Thanked 211 Times in 209 Posts
    Code:
     
      
     <!DOCTYPE html>
    <html>
    <head>
     <title> loading...econ</title>
     <meta charset="utf-8" >
     
     <link rel="stylesheet" type="text/css" href="econstyle.css">
     <meta name="viewport" content="width=device+width, initial-scale=1.0">
     
    </head>
     <body>
         <div id="wrap">
            <div id="game">
                <div id="console"></div>
                <div id="gamelog">
       <form id="form">
        Console: <input id="inputConsole"  type="text"></input>
       
        <input type="button" onclick="indexConsole.checkInput(form.inputConsole.value)" value="Send"> </input>
       
       </form> 
       
       </div>
                
            </div>
        
     </div>
     <script type="text/javascript" src="econ.js"></script>
    </body>
     </html>



    Code:
     
     var realOutput = document.getElementById("console"),
        acceptConsole = ["char", "start", "attack", "info", "help"],
        userInput = document.getElementById("inputConsole");
        
     function clearOutput() {
        realOutput.innerHTML = "";
    }
     function output(params) {
        realOutput.innerHTML += params + "<br />";
    }
     function updateInput(params) {
        userInput.value = params;
    }
     var indexConsole = {
        checkInput: function (input) {
            var check = acceptConsole.every(verifyInput);
            if (!check) {
               output(input);
            } else{
        updateInput('notFound');
     }
         function verifyInput(el) {
          return el != input;         
         }
        }
    };
    Last edited by DaveyErwin; 11-18-2013 at 01:20 AM.

  • Users who have thanked DaveyErwin for this post:

    codessential (11-18-2013)

  • #5
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,155
    Thanks
    75
    Thanked 4,338 Times in 4,304 Posts
    You access an array element of any kind the same way:
    Code:
        arrayName[ elementNumber ]
    where elementNumber ranges from 0 to one less than the length of the array.

    Example:
    Code:
    function verifyInput( inputString )
    {
        for ( var en = 0; en < acceptConsole.length; ++en )
        {
            if ( acceptConsole[en] == inputString )
            {
                ... found a match ... do something with it ...
                return; // do *NOT* look any further
            }
        }
        ... no match found... do something appropriate ...
    }
    You can make the code more complex than that, but why??? Keep it simple!!
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • Users who have thanked Old Pedant for this post:

    codessential (11-18-2013)

  • #6
    New Coder
    Join Date
    Oct 2013
    Posts
    23
    Thanks
    6
    Thanked 0 Times in 0 Posts
    ^I tried exactly that a few days ago, but for what apparently is a reason outside of my verify function, I was unable to get it to execute properly. Thanks for reassuring me everything doesn't have to be so complicated!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •