The attached is the my code. When I click on 'Upload more files', addElement
function will add one browse file. It's working in IE but it's not working in Google Chrome. In Chrome when I click on the button it's not even responding.
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ taglib uri="/tags/struts-html" prefix="html"%>
<%@ taglib uri="/tags/struts-bean" prefix="bean"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script>
var fCount = 1;
function addElement() {
fCount++;
var fObject = document.getElementById('fileSection');
var text = 'File:';
var tag='<input type="file" name="theFile[' + fCount + ']" value="">';
var brk='<br>'
var o1 = document.createTextNode(text);
var o2 = document.createElement(tag);
var o3 = document.createElement(brk);
fObject.appendChild(o3);
fObject.appendChild(o1);
fObject.appendChild(o2);
fObject.appendChild(o3);
alert("fCount" + fCount);
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body bgcolor="pink">
<html:form action="/myActionForm" method="post"
enctype="multipart/form-data">
<div id="fileSection">
Select file to upload <html:file property="theFile[0]"/><br>
</div>
<html:button property="bt" onclick="addElement()">Upload More files</html:button>
<html:submit></html:submit>
<br>
<br>
</html:form>
</body>
</html>
This is because you need to pass a tag name
to the createElement
method. Not a element fragment. IE is always strange, may be work, but it's wrong.
The correct way is like this:
var tag = document.createElement('input');
tag.setAttribute('type', 'file');
tag.setAttribute('name', 'theFile[' + fCount + ']');