...
PDA

Please Help. Text Boxes do not link up.

Bravoaloha
12-09-2009, 03:45 PM
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>
Philip M
12-09-2009, 04:08 PM
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:-

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.
Bravoaloha
12-09-2009, 04:24 PM
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).




<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>
Philip M
12-09-2009, 04:36 PM
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.
Bravoaloha
12-09-2009, 09:13 PM
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.
Bravoaloha
12-10-2009, 02:17 AM
Ok! I got everything I need except I need to make a button that will clear all fields. Anyone know how to do that??
<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>
Philip M
12-10-2009, 07:31 AM
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()">
godofreality
12-10-2009, 07:33 AM
docuemnt.formname.reset();
document.formname.reset();

EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum