<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script language="JavaScript" type="text/javascript" src="js.js"></script>
</head>
<body>
<h2>Calculate the area</h2>
Choose shape
<form>
<input type="radio" name="hinh" value="hcn" onclick="area(this.value)" />Rectangle
<input type="radio" name="hinh" value="htron" onclick="area(this.value)"/>Circle
</form>
<div id="property"></div>
</body>
</html>
// JavaScript Document
function area(value)
{
var prop = document.getElementById('property');
var content="";
if(value=='hcn')
{
content +="chieu dai:" + "<input type='text' name='width' />";
content +="chieu rong:" + "<input type='text' name='height' />" +"<br/>";
var inputWidth = document.forms[1].width.value;
document.write(inputWidth);
var w = parseFloat(inputWidth);
var inputHeight = document.forms[0].height.value;
var h = parseFloat(inputHeight);
content +="<input type='button' name='dtich1' value='Tinh dien tich' onclick=\"alert(w*h)\"/>";
}
prop.innerHTML = content;
}
Here is my code using innerHTML to calculate the area of 2 shapes, but it does not work properly.
I cannot get the value from the users' input