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 8 of 8
  1. #1
    New to the CF scene
    Join Date
    Dec 2009
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Please Help. Text Boxes do not link up.

    Hi,
    I'm a javascript noob, and I am doing a project for CS. I got the page to look how it is supposed to, but it does not work correctly. The input boxes should display a number between 1-4 in the output boxes, but the box displays [object HTMLInputElement] instead. And the buttons all perform their task to one output box, not their own output box. Sorry if that was confusing. Please take a look.


    <html>
    <!-- esp.html Nick Bravante -->
    <!-- C -->
    <!-- ======================= -->

    <head>
    <center>
    <title> <h1> ESP Tester </h1> </title>
    <script type="text/javascript"
    src="http://dave-reed.com/book/random.js">
    </script>
    <script type="text/javascript">
    function PickNumber()
    // Results: displays a random number in messageBox
    {
    var number;

    number = RandomInt(1, 4);

    document.getElementById('messageBox').value=
    "You guessed " + guessOne + " My number was " + number + ".";
    }

    </script>
    </head>


    </br>
    <body>
    Enter your Guess(1-4).<input type="num" id="guessOne" size="4" value="" />
    </body>

    <body>
    <p style="text-aign:center">
    <input type="button" value="Guess 1"
    onclick="PickNumber();" />
    <br />
    <input type="text" id="messageBox" size="90" />
    </p>
    </body>

    <head>
    <center>
    <title> <h1> ESP Tester </h1> </title>
    <script type="text/javascript"
    src="http://dave-reed.com/book/random.js">
    </script>
    <script type="text/javascript">
    function PickNumber()
    // Results: displays a random number in messageBoxTwo
    {
    var number;

    numberTwo = RandomInt(1, 4);

    document.getElementById('messageBoxTwo').value=
    "You guessed " + guessTwo + " My number was " + numberTwo + ".";
    }

    </script>
    </head>

    <head>
    <center>
    <title> <h1> ESP Tester </h1> </title>
    <script type="text/javascript"
    src="http://dave-reed.com/book/random.js">
    </script>
    <script type="text/javascript">
    function PickNumber()
    // Results: displays a random number in messageBox
    {
    var number;

    numberThree = RandomInt(1, 4);

    document.getElementById('messageBox').value=
    "You guessed " + guess + " My number was " + numberThree + ".";
    }

    </script>
    </head>

    </br>
    <body>
    Enter your Guess(1-4).<input type="num" id="guessTwo" size="4" value="" />
    </body>

    <body>
    <p style="text-aign:center">
    <input type="button" value="Guess 2"
    onclick="PickNumber();" />
    <br />
    <input type="text" id="messageBoxTwo" size="90" />
    </p>
    </body>

    </br>
    <body>
    Enter your Guess(1-4).<input type="num" id="guessThree" size="4" value="" />
    </body>

    <body>
    <p style="text-aign:center">
    <input type="button" value="Guess 3"
    onclick="PickNumber();" />
    <br />
    <input type="text" id="messageBoxThree" size="90" />
    </p>
    </body>

    <head>
    <center>
    <title> <h1> ESP Tester </h1> </title>
    <script type="text/javascript"
    src="http://dave-reed.com/book/random.js">
    </script>
    <script type="text/javascript">
    function PickNumber()
    // Results: displays a random number in messageBox
    {
    var number;

    numberFour = RandomInt(1, 4);

    document.getElementById('messageBoxFour').value=
    "You guessed " + guessFour + " My number was " + numberFour + ".";
    }

    </script>
    </head>


    </br>
    <body>
    Enter your Guess(1-4).<input type="num" id="guessFour" size="4" value="" />
    </body>

    <body>
    <p style="text-aign:center">
    <input type="button" value="Guess 4"
    onclick="PickNumber();" />
    <br />
    <input type="text" id="messageBoxFour" size="90" />
    </p>
    </body>
    </html>

  • #2
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,730
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    This is a terrible mess, with several <head> and <body> tags, and three scripts all named pickNumber() scattered about randomly. You must do better than this if you want people to help sort it out.

    Write a new page with just one "guess" start with, and then if that works extend it. It ought to be obvious that your attempt is ridiculously complicated. Study this:-

    Code:
    Guess 1 - Enter a value 1 - 4 <input type = "text" name = "guess1" id = "guess1" onblur = "doit(1)"><br>
    Guess 2 - Enter a value 1 - 4 <input type = "text" name = "guess2" id = "guess2" onblur = "doit(2)"><br>
    <input type = "text" name = "result" id = "result" size = "50">
    
    <script type = "text/javascript">
    
    function doit(which) {
    var a = "guess" + which;
    var b = document.getElementById(a).value;
    // you need to validate that the value entered is a positive number 1-4 
    var randy = Math.floor(Math.random() * 4 +1);   // random number 1-4
    var message = "You guessed " + b + " but my number was " + randy;
    document.getElementById("result").value = message;
    }
    
    </script>
    BTW, please help us to help you by following the posting guidelines and wrapping your code in [code] tags. This means use the octothorpe or # button on the toolbar which will insert opening [ code ] and closing [ /code ] tags - omit the spaces. You can (and should) edit your previous post.
    Last edited by Philip M; 12-09-2009 at 04:28 PM.

  • #3
    New to the CF scene
    Join Date
    Dec 2009
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Sorry. Here is just one of the 4 that is supposed to work. If you run the script you will see a small text box, a button named Guess 1, and a big text box. If the code worked correctly, one would enter a number from 1-4 into the small box, click guess 1, and the large box would read "You guessed (number put into small box.) My Number was (random number generated).



    Code:
    <html>
     <!-- esp.html                                      Nick Bravante -->
     <!-- Page is designed to determine weather one has ESP. Level B. -->
     <!-- =========================================================== -->
     
     <head>
     <center> 
       <title> <h1> ESP Tester </h1> </title>
       <script type="text/javascript"
               src="http://dave-reed.com/book/random.js">
       </script>
       <script type="text/javascript">
         function PickNumber()
         // Results: displays a random number in messageBox
         {
            var number;
            
            number = RandomInt(1, 4);
            
            document.getElementById('messageBox').value=
                "You guessed " + guess + " My number was " + number + ".";
         }
         
       </script>
     </head>
     
      </br>
      <body>
       Enter your Guess(1-4).<input type="num" id="guess" size="4" value="" />
       </body>
    
     <body>
       <p style="text-aign:center">
         <input type="button" value="Guess"
                onclick="PickNumber();" />
         <br />
         <input type="text" id="messageBox" size="90" />
       </p>
      </body>
     </html>

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,730
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    See post #2.

    Your problem is

    document.getElementById('messageBox').value=
    "You guessed " + document.getElementById("guess").value + " My number was " + number + ".";
    }

    <input type="num" is invalid.

    You can generate a random number in one line so no need of an external .js file.

  • #5
    New to the CF scene
    Join Date
    Dec 2009
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ok, great thanks. Now I have to repeat that process a total of 4 times. I copied and pasted what you sent me, and changed all the results to resultTwo, the name and id from guess to guess2 and I was hoping that would work, but it does not. The 1st "script" still works, but the second one changes the first, it does not compute its own random number, etc.
    Last edited by Bravoaloha; 12-09-2009 at 09:50 PM.

  • #6
    New to the CF scene
    Join Date
    Dec 2009
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ok! I got everything I need except I need to make a button that will clear all fields. Anyone know how to do that??
    Code:
    <html>
     <!-- esp.html                                      Nick Bravante -->
     <!-- Page is designed to determine weather one has ESP. Level B. -->
     <!-- =========================================================== -->
     <center>
     
     <h1> ESP Tester </h1>
     <head>
    
    <script type = "text/javascript">
    
    function doit(inputname, resultname) {
    var d = document.getElementById(inputname
    ).value;
    var randy = Math.floor(Math.random() * 4 +1);
    var message = "You guessed " + d + " my number was " + randy;
    document.getElementById(resultname
    ).value = message;
    }
    
    
    </script>
    
    
    </head>
    
    <body>
    Guess 1 - Enter a value 1 - 4<input type = "text" name = "input1" id = "input1" onblur = "doit('input1', 'result1')">
    <input type = "text" name = "result1" id = "result1" size = "50">
    <br>
    Guess 2 - Enter a value 1 - 4<input type = "text" name = "input2" id = "input2" onblur = "doit('input2', 'result2')">
    <input type = "text" name = "result2" id = "result2" size = "50">
    <br>
    Guess 3 - Enter a value 1 - 4<input type = "text" name = "input3" id = "input3" onblur = "doit('input3', 'result3')">
    <input type = "text" name = "result3" id = "result3" size = "50">
    <br>
    Guess 4 - Enter a value 1 - 4<input type = "text" name = "input4" id = "input4" onblur = "doit('input4', 'result4')">
    <input type = "text" name = "result4" id = "result4" size = "50">
    <br>
    
    <body>
    
    </html>

  • #7
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,730
    Thanks
    202
    Thanked 2,508 Times in 2,486 Posts
    Quote Originally Posted by Bravoaloha View Post
    Ok! I got everything I need except I need to make a button that will clear all fields. Anyone know how to do that??
    <input type = "button" value = "Clear the form" onclick = "document.formname.reset()">

  • #8
    Regular Coder godofreality's Avatar
    Join Date
    Jan 2009
    Posts
    234
    Thanks
    1
    Thanked 15 Times in 15 Posts
    Quote Originally Posted by Philip M View Post
    docuemnt.formname.reset();
    Code:
    document.formname.reset();
    woot found the avatar options...i swear they didn't exist b4


  •  

    Posting Permissions

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