<!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>
답변
큰 기능을 작은 부분으로 리팩토링하십시오
그런 다음이 기능을 통해 간단한 디버깅 문을 추가하여 어떤 일이 일어나고 있는지 확인할 수 있습니다.
전체 내용을 읽지 않았습니까? 까지 코드를 붙여 넣었습니다. 코드가 너무 많습니다. 문제는 추측 할 수 있습니다.
IE에는 DOM 메소드를 사용하여 테이블 셀을 동적으로 추가 할 수 없다는 잘 알려진 문제가 있습니다. 대신 innerHTML을 사용하면 효과가 있습니다.
IE에는 innerHTML이있는 테이블 내부를 편집 할 수 없다는 잘 알려진 문제점이 있습니다. – Quentin
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
을 문자열로 설정합니다. (Btw, 리스너를 추가하는 권장 방법은 addEventListener
을 사용하는 것입니다 (IE는이를 무시하고 자체적으로 attachEvent
을 사용합니다!) 어쨌든 IE와 Fx 모두에서 작동하는 DOM 0 방식이 있습니다 (afaic). element.onevent
. 변경해야
e1.onchange = SelectSubCat;
을하지만 : 당신은이 방법을 사용하는 함수에 this
을 통과하지 않아도, 단지 (함수가 호출 될 때 this
= 클릭 된 요소)로 이전 행을 대체 첫 번째 행이 SelectSubCat
을 호출하고 함수에 control_value
대신 this
을 사용하는 방법.
마지막으로 한가지, 비슷한 라인 :
el.setAttribute("onblur","javascript:check_numeric(this)");
당신은 여기에 같은 일을해야합니다.
아마도 모든 사람의 말을 들어야합니다. shouting at you 기능이 얼마나 끔찍한 지 (일부 배열은 코드 일부를 정리하는 데 도움이 될 수 있음). 그리고 (마지막 "and":)이 페이지는 JS가 없으면 작동하지 않으므로 손상됩니다.
(거기에 1과 0을 가지고, 도구 모음의 아이콘이있다) 코드 샘플 버튼을 사용하여,
- 1. JQuery는 Firefox에서 작동하지만 IE에서는 작동하지 않습니다
- 2. JavaScript는 Firefox에서 작동하지만 IE에서는 작동하지 않습니다
- 3. 자바 스크립트 window.location.replace는 Firefox에서 작동하지만 IE 또는 Chrome에서는 작동하지 않습니다.
- 4. 애플릿은 IE에서는 작동하지만 파이어 폭스에서는 작동하지 않습니다.
- 5. CSS 선택기는 Firefox에서는 작동하지만 IE에서는 작동하지 않습니다.
- 6. JavaScript가 IE에서는 작동하지만 Firefox는 작동하지 않습니다.
- 7. $ .ajax Firefox에서는 작동하지만 IE에서는 작동하지 않습니다.
- 8. XMLSocket은 Firefox에서 작동하지만 IE는 작동하지 않습니다.
- 9. C# 웹 서비스 - IE에서는 작동하지만 Safari에서는 작동하지 않습니다.
- 10. 함수는 viewDidLoad에서 작동하지만 CellForRowAtIndexPath에서는 작동하지 않습니다 - 왜?
- 11. form.defaultbutton이 Firefox에서 작동하지 않습니다.
- 12. 안드로이드 브라우저 : 일부 자바 스크립트 함수는 무작위로 작동하지 않습니다.
- 13. Firefox에서 Onload 스크립트가 작동하지 않습니다
- 14. Firefox에서 Ajax 코드가 작동하지 않습니다.
- 15. Firefox에서 입력 버튼이 작동하지 않습니다.
- 16. WScript.Shell이 FireFox에서 작동하지 않습니다.
- 17. FF에서 작동하지만 IE에서는 작동하지 않는 removeAttr
- 18. MVC : DELETE 동사를 사용하면 FF에서 작동하지만 IE에서는 작동하지 않습니다.
- 19. LocalScroll은 Firefox, IE에서는 완벽하게 작동하지만 Safari에서는 작동하지 않습니다.
- 20. 이 코드는 Chrome, Firefox에서는 작동하지만 IE에서는 작동하지 않습니다.
- 21. Firefox에서 사용자 정의 jQuery 함수가 작동하지 않습니다.
- 22. JS sort는 Firefox에서 작동하지만 IE는 작동하지 않습니다. 이유가 없습니다.
- 23. 자바 스크립트 브라우저가 Firefox에서 흔들림
- 24. CSS는 Firefox에서 잘 작동하지만 IE에서는 제대로 표시되지 않습니까?
- 25. 내 jQuery 함수는 IE8에서는 작동하지만 FF3.6.11에서는 작동하지 않습니다. 왜?
- 26. Mozilla에서 작업 중이지만 IE에서는 작동하지 않습니다
- 27. jquery load() 함수는 Firefox에서는 작동하지만 Chrome에서는 작동하지 않습니다.
- 28. onmouseover 이벤트가 firefox에서 작동하지 않습니다.
- 29. Firefox에서 preventDefault가 작동하지 않습니다.
- 30. ClickOnce가 Firefox에서 작동하지 않습니다.
가 올바르게 코드 형식을 주시겠습니까 (JS 이벤트에 대한 추가 정보를 원하시면. Introduction to Events 참조), 아마도 관련된 모든 부분이 아니라면 관련 부분 만 포함하십시오. –
사람들이 읽을 수 있도록 포맷을 시도하십시오. –
코드에 관해 묻는 질문 : http://www.catb.org/~esr/faqs/smart-questions.html#code 특히 소스 덤프를 최소한의 테스트 케이스로 바꾸어서 관련성없는 코드를 통해 이동하십시오 : https://wiki.mozilla.org/QA/Minimal_Test_Cases 또한 예상되는 동작과 발생하는 동작을 설명하십시오. 우리는 왜 그것이 잘못되는지에 더하여 무엇이 잘못 될지 알아낼 필요가 없습니다. 오류 메시지가 있으면 포함 시키십시오. – outis