Quick I/O questions

tonyman · 02-14-2013, 04:26 PM

Hey everyone,

I only had a quick question, sorry about opening a whole new thread for this. Its probably a stupid question, but I am curious to know if there is a simple way to do what I am trying to do.

Okay, so essentially I want the user to input a number in input box 1 and 2 and I want the two boxes to cross reference each other to say if the numbers match or not.

So for example. I put the number '5' in Input Box 1. And I put the number '6' in Input Box 2. In a text area it will display if its a match or not.

I have tried to get it to work and cannot figure out a way to match them. I can get them to add together, display seperately but am puzzled with a way to get them to match. The only way I got it to work was with a realllllllly long if statement and using prompts (which is a little cluttery).

Below is simple code. I dont really need someone to add code, just let me know a method to get the inputs to cross reference each other.

Thanks!

PS Keep in mind that I have very little code. I want to know if this is possibly before I give up my prompt and if statements code to change to this.

Code:

<html>
<head>
	<script type="text/javascript">
	
	
	function one() {
		alert(i1.value);
		}
	
	
	

		
	</script>
</head>
<body>
	<input id="i1" size="1">
	<br />
	<input id="i2" size="1">
	
	<br />
	
	<button onclick="one()" id="c1" >Calculate</button>

	<br />
	
	<textarea name="t1"></textarea>
</body>
</html>

Philip M · 02-14-2013, 04:40 PM

Just make a straightforward comparison, but ensure that the values entered by the user are changed from strings to numbers using Number();
Instead of ===, == would serve perfectly adequately here. To find out more, Google for Javascript comparison operators.

Code:

First Number <input type = "text" id="inp1" size="1">
<br>
Second Number <input type = "text" id="inp2" size="1">
<br>
<input type = "button" value = "Compare" onclick = "compare()">

<script type = "text/javascript">
function compare() {
var a = Number(document.getElementById("inp1").value) || 0; // Trap NaN entries
document.getElementById("inp1").value = a;  // write it back to the field
var b = Number(document.getElementById("inp2").value) || 0; // Trap NaN entries
document.getElementById("inp2").value = b;  // write it back to the field

if (a === b) {  // identical match
alert ("The two numbers match");
}
else {
alert ("The two numbers are different");  // alerts are regarded as obsolete and should only be used for testing.
}
}

</script>

Quizmaster: How many days will there be in the year 2014?
Contestant: Er... is it 60 or 52?

snakehill · 02-14-2013, 04:47 PM

To add to Philip, if you want to display the results in the textarea instead of an alert (that's at least what I got from your question), you could give the textarea an ID and replace the alerts with

Code:

document.getElementById('t1').value = "The two numbers match/The two numbers are different";

tonyman · 02-14-2013, 04:48 PM

Okay perfect. That worked! Thanks a million. I am going to switch all my stuff over now. This will be much cleaner then having a bajjillion prompts pop up and using a crazy amount of if statements.

Thanks again!

Philip M · 02-14-2013, 04:54 PM

Quote:

Originally Posted by tonyman

Okay perfect. That worked! Thanks a million. I am going to switch all my stuff over now. This will be much cleaner then having a bajjillion prompts pop up and using a crazy amount of if statements.

Thanks again!

Prompts are regarded as obsolete and should never be used in modern Javascript coding.

It is better to use DOM methods to display a message to the user in a <span> or a <div> rather than place the message in a textarea or textbox.

A practical use for comparing two text values is to check that the user's email address and the confirm (repeat) email address values match.