[nfbcs] Javascript code review for a calculater that isn't complete but had errors with validation

Wed Nov 23 15:47:08 UTC 2016

OK here is my corrected version of this. Remeber I am no JavaScript expert by any means.

Here is what I changed.

1. Moved the script to the page head section where scripts are generally placed.
2. Added the command function to the start of your function removed the unneeded <:
	Your code: <function_add numbers()
	My code: function function_add() 
3. Corrected the form of the calls to collect the numbers made sure the results were numbers not strings, made the caculator work with floating point numbers with the parseFloat function;
	Your code: var first_number=int.parse(Document.GetElementById("Text1").value;
	My code: var first_number=parseFloat(document.getElementById('Text1').value);
4. Corrected the results variable call, renamed the variable and removed the quotes, your dealing with numbers here not strings.
	Your code: var result="first_number+second_number")
	My code: var myResult=(first_number+second_number);
5. Placed the results into the page as part of a paragraph, you had no place for the results to be displayed.
	Your code: document.getElement"txtresult").value=result;
	My code: document.getElementById('txtresult').innerHTML = myResult;
6. Cleaned up the HTML removed a </form> tag that was never opened. Created a paragraph and span to display the results. disabled the operator field and it did nothing. If you have operators it would be best to put them into a select control so that people don't enter strings that are not true math operators. I added a onBlur attribute that calls the function so that the calcualtion is performed when the user tabs or move out of the field.

Below is my code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
	<head>
		<title>Accessible calculator</title>

		<script>
			function function_add()
			{
				var first_number=parseFloat(document.getElementById('Text1').value);
				var second_number=parseFloat(document.getElementById('Text2').value);
				var myResult=(first_number+second_number);
				document.getElementById('txtresult').innerHTML = myResult;
			}
		</script>

       </head>

       <body>
	   	<p>
		   	<label for"first number">Enter the first number: </label>
		   	<input type="text" title="Enter first number:" label="first number" alt="first number" name="first number" id="Text1" /><br/>
		   	<label for"operation">Choose operation: </label>
		   	<input type="text" title="opperation"  name="opperation" disabled="true"/><br/>
		   	<label for"2nd number">Enter the second number: </label>
		   	<input type="text" title="2nd number" id="Text2" onblur="function_add()"/><br/>
		   	<button type="button" title="calculate" name="calculate" onclick="function_add()"/>Calculate</button>
		</p>
		<p  style="font-size: xx-large; font-weight: bolder;">The Answer: <span id="txtresult"></span></p>
</body>
</html>

Greg Kearney

> On Nov 22, 2016, at 5:49 PM, Aaron Cannon via nfbcs <nfbcs at nfbnet.org> wrote:
> 
> Replied off list.
> 
> Aaron
> 
> --
> This message was sent from a mobile device
> 
> 
>> On Nov 22, 2016, at 17:30, Taylor Arndt via nfbcs <nfbcs at nfbnet.org> wrote:
>> 
>> <!DOCTYPE html
>> PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
>>       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
>>     <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
>>       <head>
>> 
>>         <title>Accessible calculater</title>
>>       </head>
>> 
>>       <body>
>>         <!-- ... body of document ... -->
>>       </body>
>> label for"first number">Enter the first number</label>
>> <input type="text" title="Enter first number:" label="first number"
>> alt="first number" name="first number" />
>> <label for"operation">Choose operation</label>
>> <input type="text" title="opperation"  name="opperation"/>
>> <label for"2nd number">Enter the second number</label>
>> <input type="text" title="2nd number"/>
>> <input type="button" title="calculate" name="calculate"
>> onclick="Display result"/>
>> </form>
>> <script>
>> <function_add numbers()
>> {
>> var first_number=int.parse(Document.GetElementById("Text1").value;
>> var second_number=int.parse(Document.GetElementByID("Text2").value;
>> var result="first_number+second_number");
>> document.getElement"txtresult").value=result;
>> </script>
>> </body>
>> </html>
>> I am having these issues:
>> WarningNo Character Encoding Found! Falling back to UTF-8.
>> None of the standards sources gave any information on the character
>> encoding labeling for this
>> '
>> 
>> I also don't know where to go from here, as i am a starter in javascript
>> 
>> _______________________________________________
>> nfbcs mailing list
>> nfbcs at nfbnet.org
>> http://nfbnet.org/mailman/listinfo/nfbcs_nfbnet.org
>> To unsubscribe, change your list options or get your account info for nfbcs:
>> http://nfbnet.org/mailman/options/nfbcs_nfbnet.org/cannona%40fireantproductions.com
> 
> _______________________________________________
> nfbcs mailing list
> nfbcs at nfbnet.org
> http://nfbnet.org/mailman/listinfo/nfbcs_nfbnet.org
> To unsubscribe, change your list options or get your account info for nfbcs:
> http://nfbnet.org/mailman/options/nfbcs_nfbnet.org/gkearney%40gmail.com