<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>:: Gharsansar Spices Order Form ::</title>
<script language="javascript" type="text/javascript">
function addRow(tableID)
{
var rowCount;
var rowno;
var table = document.getElementById(tableID);
rowCount = table.rows.length;
var row = table.insertRow(rowCount);
row.id = "row"+rowCount;
rowno = row.id;
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "checkbox";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
cell2.innerHTML = rowCount + 1;
cell2.className ="style2";
var cell3 = row.insertCell(2);
var e1 = document.createElement('select');
e1.name = 'Category['+rowCount+']';
e1.id = 'Category['+rowCount+']';
e1.setAttribute("onclick","javascript:SelectSubCat(this);");
choice = document.createElement('option');
choice.value = ':: Select A Product ::';
choice.appendChild(document.createTextNode(':: Select A Product ::'));
e1.appendChild(choice);
var choice = document.createElement('option');
choice.value = 'Jalani Jaljira';
choice.appendChild(document.createTextNode('Jalani Jaljira'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Pav Bhaji Masala';
choice.appendChild(document.createTextNode('Pav Bhaji Masala'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Sambhar Masala';
choice.appendChild(document.createTextNode('Sambhar Masala'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Sabji Masala';
choice.appendChild(document.createTextNode('Sabji Masala'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Kitchen King Masala';
choice.appendChild(document.createTextNode('Kitchen King Masala'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Garam Masala';
choice.appendChild(document.createTextNode('Garam Masala'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Meat Masala';
choice.appendChild(document.createTextNode('Meat Masala'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Chat Masala';
choice.appendChild(document.createTextNode('Chat Masala'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Chicken Masala';
choice.appendChild(document.createTextNode('Chicken Masala'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Ghar Sansar Jaljira';
choice.appendChild(document.createTextNode('Ghar Sansar Jaljira'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Dry Ginger Powder';
choice.appendChild(document.createTextNode('Dry Ginger Powder'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Dry Mango Powder';
choice.appendChild(document.createTextNode('Dry Mango Powder'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Pudina Powder';
choice.appendChild(document.createTextNode('Pudina Powder'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Jeera Powder';
choice.appendChild(document.createTextNode('Jeera Powder'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Black Pepper';
choice.appendChild(document.createTextNode('Black Pepper'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'White Pepper Powder';
choice.appendChild(document.createTextNode('White Pepper Powder'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Fennel Powder (Saunf)';
choice.appendChild(document.createTextNode('Fennel Powder (Saunf)'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Kashmiri Mirch';
choice.appendChild(document.createTextNode('Kashmiri Mirch'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Kasuri Methi';
choice.appendChild(document.createTextNode('Kasuri Methi'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Jaljira';
choice.appendChild(document.createTextNode('Jaljira'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Chana Chole Masala';
choice.appendChild(document.createTextNode('Chana Chole Masala'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Super Garam Masala';
choice.appendChild(document.createTextNode('Super Garam Masala'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Haldi Powder';
choice.appendChild(document.createTextNode('Haldi Powder'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Dhaniya Powder';
choice.appendChild(document.createTextNode('Dhaniya Powder'));
e1.appendChild(choice);
choice = document.createElement('option');
choice.value = 'Red Chilli Powder';
choice.appendChild(document.createTextNode('Red Chilli Powder'));
e1.appendChild(choice);
cell3.appendChild(e1);
var cell4 = row.insertCell(3);
e_sub_cat = document.createElement('select');
e_sub_cat.name = 'SubCat['+rowCount+']';
e_sub_cat.id = 'SubCat['+rowCount+']';
cell4.appendChild(e_sub_cat);
var cell5 = row.insertCell(4);
var el = document.createElement('input');
el.type = 'text';
el.name = 'quantity[]';
el.size = 20;
el.setAttribute("onblur","javascript:check_numeric(this)");
cell5.appendChild(el);
}
function deleteRow(tableID)
{
try {
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
for(var i=0; i<rowCount; i++)
{
var row = table.rows[i];
var chkbox = row.cells[0].childNodes[0];
if(null != chkbox && true == chkbox.checked) {
table.deleteRow(i);
rowCount--;
i--;
}
}
}catch(e) {
alert(e);
}
}
function check_numeric(control)
{
var val=control.value;
var first=val.substring(0,1);
if(isNaN(val))
{
alert("Enter a numeric value only!");
control.value="";
control.focus();
}
if(first=="-")
{
alert("Enter a numeric value only!");
control.value="";
control.focus();
}
return true;
}
function SelectSubCat(control_value)
{
// ON selection of category this function will work
//var sub_cat_id = document.getElementById('SubCat['+rowCount+']').id;
var sub_cat_id = control_value.id;
var mySplitResult = sub_cat_id.split("[");
var control_no = mySplitResult[1];
var control_row_no = control_no.split("]");
var row_num = control_row_no[0];
var i;
for(i=document.getElementById('SubCat['+row_num+']').options.length-1;i>=0;i--)
{
document.getElementById('SubCat['+row_num+']').remove(i);
}
if(control_value.value == 'Jalani Jaljira')
{
addOption("2.5 gm", "2.5 gm",row_num);
addOption("5 gm", "5 gm",row_num);
addOption("50 gm", "50 gm",row_num);
addOption("100 gm", "100 gm",row_num);
addOption("150 gm", "150 gm",row_num);
addOption("300 gm", "300 gm",row_num);
addOption("500 gm", "500 gm",row_num);
}
if(control_value.value == 'Pav Bhaji Masala')
{
addOption("15 gm", "15 gm",row_num);
addOption("50 gm", "50 gm",row_num);
addOption("100 gm", "100 gm",row_num);
}
if(control_value.value == 'Sambhar Masala')
{
addOption("50gm", "50gm",row_num);
addOption("100gm", "100gm",row_num);
}
if(control_value.value == 'Sabji Masala')
{
addOption("15 gm", "15 gm",row_num);
addOption("50 gm", "50 gm",row_num);
addOption("100 gm", "100 gm",row_num);
}
if(control_value.value == 'Kitchen King Masala')
{
addOption("15 gm", "15 gm",row_num);
addOption("50 gm", "50 gm",row_num);
addOption("100 gm", "100 gm",row_num);
addOption("1 Kg", "1 Kg",row_num);
}
if(control_value.value == 'Garam Masala')
{
addOption("50gm", "50gm",row_num);
addOption("100gm", "100gm",row_num);
}
if(control_value.value == 'Meat Masala')
{
addOption("15 gm", "15 gm",row_num);
addOption("50 gm", "50 gm",row_num);
addOption("100 gm", "100 gm",row_num);
}
if(control_value.value == 'Chat Masala')
{
addOption("15 gm", "15 gm",row_num);
addOption("50 gm", "50 gm",row_num);
addOption("200 gm", "200 gm",row_num);
}
if(control_value.value == 'Chana Masala')
{
addOption("50 gm", "50 gm",row_num);
addOption("100 gm", "100 gm",row_num);
}
if(control_value.value == 'Chicken Masala')
{
addOption("50 gm", "50 gm",row_num);
addOption("100 gm", "100 gm",row_num);
}
if(control_value.value == 'Ghar Sansar Jaljira')
{
addOption("100 gm", "100 gm",row_num);
}
if(control_value.value == 'Dry Ginger Powder')
{
addOption("100 gm", "100 gm",row_num);
}
if(control_value.value == 'Dry Mango Powder')
{
addOption("100 gm", "100 gm",row_num);
}
if(control_value.value == 'Pudina Powder')
{
addOption("100 gm", "100 gm",row_num);
}
if(control_value.value == 'Jeera Powder')
{
addOption("50 gm", "50 gm",row_num);
addOption("100 gm", "100 gm",row_num);
}
if(control_value.value == 'Black Pepper')
{
addOption("50 gm", "50 gm",row_num);
addOption("100 gm", "100 gm",row_num);
}
if(control_value.value == 'White Pepper Powder')
{
addOption("50 gm", "50 gm",row_num);
addOption("100 gm", "100 gm",row_num);
}
if(control_value.value == 'Fennel Powder (Saunf)')
{
addOption("50 gm", "50 gm",row_num);
addOption("100 gm", "100 gm",row_num);
}
if(control_value.value == 'Kashmiri Mirch')
{
addOption("100 gm", "100 gm",row_num);
addOption("1 Kg", "1 Kg",row_num);
}
if(control_value.value == 'Kasuri Methi')
{
addOption("25 gm", "25 gm",row_num);
addOption("50 gm", "50 gm",row_num);
addOption("100 gm", "100 gm",row_num);
addOption("500 gm", "500 gm",row_num);
}
if(control_value.value == 'Jaljira')
{
addOption("15 gm", "15 gm",row_num);
}
if(control_value.value == 'Chana Chole Masala')
{
addOption("15 gm", "15 gm",row_num);
}
if(control_value.value == 'Super Garam Masala')
{
addOption("100 gm", "100 gm",row_num);
addOption("200 gm", "200 gm",row_num);
addOption("1 Kg", "1 Kg",row_num);
}
if(control_value.value == 'Haldi Powder')
{
addOption("100 gm", "100 gm",row_num);
addOption("200 gm", "200 gm",row_num);
addOption("500 gm", "500 gm",row_num);
addOption("1 Kg", "1 Kg",row_num);
}
if(control_value.value == 'Dhaniya Powder')
{
addOption("100 gm", "100 gm",row_num);
addOption("200 gm", "200 gm",row_num);
addOption("500 gm", "500 gm",row_num);
addOption("1 Kg", "1 Kg",row_num);
}
if(control_value.value == 'Red Chilli Powder')
{
addOption("100 gm", "100 gm",row_num);
addOption("200 gm", "200 gm",row_num);
addOption("500 gm", "500 gm",row_num);
addOption("1 Kg", "1 Kg",row_num);
}
}//////////////////
function addOption(value, text, rno)
{
var optn = document.createElement("OPTION");
optn.text = text;
optn.value = value;
//if(rowCount==undefined)
// rowCount=0;
document.getElementById('SubCat['+rno+']').options.add(optn);
}
</script>
<style type="text/css">
<!--
.style1 {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #0066FF;}
.style2 {border:0px; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#0066FF; font-weight:bold;}
.style3 {
font-size: 14px;
font-weight: bold;
}
.table{border: 2px solid #CCCCCC;}
.button{background-color:#0099FF; font-family:Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color:#FFFFFF; font-size:12px; }
.table_cell_new {
font-size:11px;
font-family:Verdana, sans-serif, serif, Arial, Helvetica;
color: #555859;
font-weight: 300;
width: 180px;
}
.line {
color:#CCCCCC; size:inherit; border-bottom:solid;
}
.style4 {font-family: Verdana, Arial, Helvetica, sans-serif;}
.style5 {font-size: 12px;}
-->
</style>
</head>
<body>
<table width="583" border="0" align="center">
<tr>
<td width="596" height="298">
<form name="drop_list" method="post" action="submitorder.php" enctype="multipart/form-data" >
<table width="581" border="0" align="center" class="table">
<tbody>
<tr>
<td height="149" valign="top"><table width="476" border="0" align="left">
<tr>
<td height="34" colspan="3" class="style1 style3">Submit Order Details</td>
</tr>
<tr>
<td width="138" class="txtLabel style4 style5">Company Name</td>
<td width="328" colspan="2"><label>
<input name="companyname" type="text" class="table_cell_new" id="companyname" maxlength="50" />
</label></td>
</tr>
<tr>
<td class="txtLabel style4 style5">Address</td>
<td colspan="2"><input name="address" type="text" class="table_cell_new" id="address" maxlength="50" /></td>
</tr>
<tr>
<td class="txtLabel style4 style5">Contact No.</td>
<td colspan="2"><input name="contactno" type="text" class="table_cell_new" id="contactno" maxlength="15" /></td>
</tr>
<tr>
<td class="txtLabel style4 style5">Email Add.</td>
<td colspan="2"><input name="email" type="text" class="table_cell_new" id="email" maxlength="15" /></td>
</tr>
<tr>
<td height="11" colspan="3" valign="top"></td>
</tr>
</table></td>
</tr>
<tr>
<td height="10" valign="top" class="line"> </td>
</tr>
<tr>
<td width="571" height="56" valign="top"><table width="570" border="0">
<tr>
<td width="52" class="style2">Select </td>
<td width="51" align="left" class="style2"><div align="left">S. No.</div></td>
<td width="197" align="left" class="style2"><div align="left">Product Name</div></td>
<td width="103" align="left" class="style2"><div align="left">Variation</div></td>
<td width="145" align="left" class="style2"><div align="left">Quantity</div></td>
</tr>
</table>
<table id="dataTable" width="571" border="0">
<tr>
<td width="60"> </td>
<td width="56" class="style2"> 1 </td>
<td width="204" align="left"><div align="left">
<select name="Category[0]" id="Category[0]" onChange="SelectSubCat(this);">
<option value="0" selected="true">:: Select A Product ::</option>
<option value="Jalani Jaljira">Jalani Jaljira</option>
<option value="Pav Bhaji Masala">Pav Bhaji Masala</option>
<option value="Sambhar Masala">Sambhar Masala</option>
<option value="Sabji Masala">Sabji Masala</option>
<option value="Kitchen King Masala">Kitchen King Masala</option>
<option value="Garam Masala">Garam Masala</option>
<option value="Meat Masala">Meat Masala</option>
<option value="Chat Masala">Chat Masala</option>
<option value="Chicken Masala">Chicken Masala </option>
<option value="Ghar Sansar Jaljira">Ghar Sansar Jaljira</option>
<option value="Dry Ginger Powder">Dry Ginger Powder</option>
<option value="Dry Mango Powder">Dry Mango Powder</option>
<option value="Pudina Powder">Pudina Powder</option>
<option value="Jeera Powder">Jeera Powder</option>
<option value="Black Pepper">Black Pepper</option>
<option value="White Pepper Powder">White Pepper Powder</option>
<option value="Fennel Powder (Saunf)">Fennel Powder (Saunf) </option>
<option value="Kashmiri Mirch">Kashmiri Mirch </option>
<option value="Kasuri Methi">Kasuri Methi </option>
<option value="Jaljira">Jaljira </option>
<option value="Chana Chole Masala">Chana Chole Masala </option>
<option value="Super Garam Masala">Super Garam Masala</option>
<option value="Haldi Powder">Haldi Powder </option>
<option value="Dhaniya Powder">Dhaniya Powder</option>
<option value="Red Chilli Powder">Red Chilli Powder</option>
</select>
</div></td>
<td width="109" align="left"><div align="left">
<select name="SubCat[0]" id="SubCat[0]">
</select>
</div></td>
<td width="120"><input name="quantity[]" type="text" size="20" maxlength="25" onblur="return check_numeric(this);"/></td>
</tr>
</table>
<br>
<input type="button" class="button" onClick="addRow('dataTable')" value="Add More" />
<input type="button" class="button" onClick="deleteRow('dataTable')" value="Delete Row" />
<input name="Submit" type="submit" class="button" value="Submit Details" />
</td>
</tr>
</tbody>
</table>
</form>
</td>
</tr>
</table>
</body>
</html>
答案 0 :(得分:0)
尝试将大量函数重构为较小的部分(您可以使用标准函数添加选项元素),这意味着更少的复制/粘贴代码。
然后,您可以通过这些函数添加简单的调试语句,以查看发生的情况。
答案 1 :(得分:0)
e1.setAttribute("onclick","javascript:SelectSubCat(this);");
我认为这条线可能是原因。请看以下内容(第一行使用"onchange"
,但JS添加的行使用"onclick"
...):
document.getElementById("Category[0]").onchange // the first row
>> function()
但是,
document.getElementById("Category[1]").onclick // the second row
>> "SelectSubCat(this);"
即。 Internet Explorer将onclick
设置为字符串! (顺便说一句,添加监听器的推荐方法是使用addEventListener
(但IE忽略它并使用自己的attachEvent
!)。无论如何,有一种DOM 0方式可以正常工作(在IE和Fx:element.onevent
。使用此方法时,您不必将this
传递给函数,只需在调用函数时将(this
=单击的元素替换为上一行):
e1.onchange = SelectSubCat;
但是,您必须更改第一行调用SelectSubCat
的方式,并在函数中使用this
而不是control_value
。
最后一件事,类似的一句话:
el.setAttribute("onblur","javascript:check_numeric(this)");
你必须在这里做同样的事情。
你应该听听所有人shouting at you你的功能有多糟糕(可能有些数组可能有助于清理代码的某些部分)。而且(最后一个“和”:),如果没有JS,这个页面将无法运行,因此会被破坏。
(有关JS中事件的更多信息,请参阅Introduction to Events。)
答案 2 :(得分:-1)
没有读完整件事 - 你粘贴了远太多的代码 - 但我会猜测这个问题。
IE有一个众所周知的问题,即它无法使用DOM方法动态添加表格单元格。使用innerHTML代替,这有效。