DOM Error in internet explorer


S

Srini

Hi All,

I need the following problem to be solved in internet explorer
(working fine in firefox). Please copy the code and check it in the
internet explorer.
Please click the link addmore and try to submit the form. Then you can
see the javascript error. I need to fix this problem, so please
explain me in this regards.

---------------------------------------------------------------------------------------------------
<html>
<head>
<title>removeChild() Example</title>
<script type="text/javascript">
function resetForm() {

alert(document.getElementById('noFiles').value);
document.getElementById('noFiles').value = '';
document.getElementById('noFiles').value = 1;
}
function frmvalidate(type,id)
{
//alert(document.venueform.noFiles.value)
var lastRow = document.venueform.noFiles.value;
for(file_number=1;file_number<=lastRow;file_number++)
{
//alert(file_number);
var file_element = eval("document.venueform.fileName_"+file_number
+".value");
alert(file_element);
if(file_element != "" && file_element.indexOf(".jpg")== -1 &&
file_element.indexOf(".JPG") == -1 && file_element.indexOf(".jpeg") ==
-1 )
{
alert("Please upload JPEG images only");
return false;
}
}
}
function addFileTab()
{
oTBody = document.getElementById("addFileVenueId");
document.venueform.noFiles.value =
parseInt(document.venueform.noFiles.value) + 1;
var lastRow = document.venueform.noFiles.value

//var hidden_value = lastRow ;
//var lastRow = parseInt(lRow) - 1;

if(lastRow <= 5 )
{
oTBody.insertRow(lastRow);
// var file_name = "fileName"+lastRow;
var oinput = document.createElement("input");
oinput.setAttribute("type", "file");
oinput.setAttribute("class", "textbox");
oinput.setAttribute("size", "25");
oinput.setAttribute("name", "fileName_"+lastRow);
// oinput.setAttribute("id", file_name);
oTBody.rows[lastRow].insertCell(0);
oTBody.rows[lastRow].cells[0].align = "left";
// oTBody.rows[lastRow].cells[0].setAttribute("class","litetd");
oTBody.rows[lastRow].cells[0].className="darktd";
oTBody.rows[lastRow].cells[0].setAttribute("colspan","2");
oTBody.rows[lastRow].cells[0].appendChild(oinput);


//document.venueform.noFiles.value =
parseInt(document.venueform.noFiles.value) + 1;

//alert(document.venueform.noFiles.value);
//document.getElementById("noFiles").value = hidden_value;

if(lastRow == 5)
document.getElementById("add_row").style.visibility = "hidden";

/*if(lastRow == 2)
document.getElementById("delete_row").style.visibility = "visible";
*/

}
}
</script>
</head>
<body onload='resetForm()'><form name=venueform>
<table width='50%' border='0' align='center' id='addFileVenueId'
cellspacing=1 cellpadding=0>
<tr align='center' class='rowhead'>
<th height='20' colspan='2' class='headrow'>Upload Photo upto
nos</th>
<td >
<span id='add_row'>
<a href='javascript:;' onclick='addFileTab()'>Add more</a></span>
</td>
</tr>
<tr>
<td colspan='2' align='left' class='darktd'>
<input type='file' name='fileName_1' id='fileName1'
class='textbox' size='25'>
</td>
</tr>
<tr>
<td>
<input type='button' value='Add' class='button' onClick="return
frmvalidate()">
<input type='hidden' name='noFiles' value='1' id='noFiles'>
</td>
</tr>

</table>
</form>
</body>
</html>

---------------------------------------------------------------------------------------------------

Thanks in Advance.

Regards,
Srinivasan M
 
Ad

Advertisements

D

David Mark

Hi All,

I need the following problem to be solved in internet explorer
(working fine in firefox). Please copy the code and check it in the
internet explorer.
Please click the link addmore and try to submit the form. Then you can
see the javascript error. I need to fix this problem, so please
explain me in this regards.

---------------------------------------------------------------------------­------------------------
<html>
<head>
<title>removeChild() Example</title>

That's an odd title for this example.
<script type="text/javascript">
function resetForm() {

alert(document.getElementById('noFiles').value);
document.getElementById('noFiles').value = '';
document.getElementById('noFiles').value = 1;}

function frmvalidate(type,id)
{
//alert(document.venueform.noFiles.value)
var lastRow = document.venueform.noFiles.value;
for(file_number=1;file_number<=lastRow;file_number++)
{
//alert(file_number);
var file_element = eval("document.venueform.fileName_"+file_number
+".value");
alert(file_element);
if(file_element != "" && file_element.indexOf(".jpg")== -1 &&
file_element.indexOf(".JPG") == -1 && file_element.indexOf(".jpeg") ==
-1 )
{
alert("Please upload JPEG images only");
return false;
}
}}

function addFileTab()
{
oTBody = document.getElementById("addFileVenueId");
document.venueform.noFiles.value =
parseInt(document.venueform.noFiles.value) + 1;
var lastRow = document.venueform.noFiles.value

//var hidden_value = lastRow ;
//var lastRow = parseInt(lRow) - 1;

if(lastRow <= 5 )
{
oTBody.insertRow(lastRow);
// var file_name = "fileName"+lastRow;
var oinput = document.createElement("input");
oinput.setAttribute("type", "file");
oinput.setAttribute("class", "textbox");
oinput.setAttribute("size", "25");
oinput.setAttribute("name", "fileName_"+lastRow);

Here's the problem. This is a known IE bug. The name is set, but it
doesn't update the elements collection. For a workaround, you can
either iterate through the form elements and look for the name you
need or set the ID and use getElementById.
// oinput.setAttribute("id",file_name);
oTBody.rows[lastRow].insertCell(0);
oTBody.rows[lastRow].cells[0].align = "left";
// oTBody.rows[lastRow].cells[0].setAttribute("class","litetd");
oTBody.rows[lastRow].cells[0].className="darktd";
oTBody.rows[lastRow].cells[0].setAttribute("colspan","2");
oTBody.rows[lastRow].cells[0].appendChild(oinput);

//document.venueform.noFiles.value =
parseInt(document.venueform.noFiles.value) + 1;

//alert(document.venueform.noFiles.value);
//document.getElementById("noFiles").value = hidden_value;

if(lastRow == 5)
document.getElementById("add_row").style.visibility = "hidden";

/*if(lastRow == 2)
document.getElementById("delete_row").style.visibility = "visible";
*/

}}

</script>
</head>
<body onload='resetForm()'><form name=venueform>
<table width='50%' border='0' align='center' id='addFileVenueId'
cellspacing=1 cellpadding=0>
<tr align='center' class='rowhead'>
<th height='20' colspan='2' class='headrow'>Upload Photo upto
nos</th>
<td >
<span id='add_row'>
<a href='javascript:;' onclick='addFileTab()'>Add more</a></span>

You should generate this link with script if there is no unscripted
equivalent. In any event, don't use "javascript:;" for an href (or
anything preceded by "javascript:" for that matter.)
 
Ad

Advertisements

S

Srini

Hi David Mark,

Thank you very much for your valuable help in this regard.
I won't forget this.

Thanks,
Srinivasan M
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top