itemwiseとsupplierwiseの値を持つ2つのラジオボタンがあります。itemwise を選択した場合は 1 つのテーブルを表示し、supplierwise を選択した場合は別のテーブルを表示する必要があります。私のコーディングはテーブルを正しく表示していますが、テーブルは同じ位置に表示されません。それらを同じ位置に表示するにはどうすればよいですか? 私のコードは以下のとおりです-----
<html>
<head>
<script language="javascript">
function hideTable()
{
document.getElementById('item_table').style.visibility = "hidden";
document.getElementById('supplier_table').style.visibility = "hidden";
}
function showItemTable()
{
if(document.getElementById("item_selection").checked==true)
{
document.getElementById('supplier_table').style.visibility = "hidden";
document.getElementById('item_table').style.visibility = "visible";
}
}
function showSupplierTable()
{
if(document.getElementById("supplier_selection").checked==true)
{
document.getElementById('item_table').style.visibility = "hidden";
document.getElementById('supplier_table').style.visibility = "visible";
}
}
</script>
</head>
<body onload="javascript:hideTable()">
<form name = "form1" method ="post" action="">
<table border="1" align="center">
<tr>
<td>Report Required</td>
<td><input type="radio" name="item_selection" id="item_selection" onclick="showItemTable()">Item Wise</td>
<td><input type="radio" name="item_selection" id="supplier_selection" onclick="showSupplierTable()">Supplier Wise</td>
</tr>
</table>
<table border="1" bgColor="#9999CC" align="center" id="item_table">
<tr>
<td colspan="2">Item Type</td>
<td colspan="2"><%=item_typeddListStr%></td>
</tr>
<tr>
<td colspan="2">Item Category</td>
<td colspan="2"><%=item_categoryddListStr%></td>
</tr>
<tr>
<td colspan="2">Item Name</td>
<td colspan="2" id='item_code'>
<select name='item_code' >
<option value='-1'></option>
</select>
</td>
</tr>
<tr>
<td>From Date</td>
<td><input type="text" name="indent_date" id="issue_date_first" size="12"/></td>
<td>To Date</td>
<td><input type="text" name="indent_date" id="issue_date_second" size="12"/></td>
</tr>
<tr>
<td colspan="1"><input type ="submit" name ="submit" value ="Get Records" onclick="return validate()"></td>
<td colspan="1"><input type ="submit" name ="submit" value ="Generate Report" onclick="return validate()"></td>
<td colspan="1"><input type ="submit" name ="submit" value ="Clear Form"></td>
<td colspan="1"><input type ="submit" name ="submit" value ="Back"></td>
</tr>
</table>
<table border="1" bgColor="#9999CC" align="center" id="supplier_table">
<tr>
<td colspan="2">Supplier Name</td>
<td colspan="2"><%=supplier_codeddListStr%></td>
</tr>
<tr>
<td colspan="1"><input type ="submit" name ="submit" value ="Get Records" onclick="return validate()"></td>
<td colspan="1"><input type ="submit" name ="submit" value ="Generate Report" onclick="return validate()"></td>
<td colspan="1"><input type ="submit" name ="submit" value ="Clear Form"></td>
<td colspan="1"><input type ="submit" name ="submit" value ="Back"></td>
</tr>
</table>
</form>
</body>
</html>