Log in

View Full Version : Multiple Upload Using PHP/Ajax


cancer10
09-18-2009, 05:28 PM
Hi

I am trying to populate new FILE elements on the fly using javascript. I am able to do it but I cannot retrieve the attachment file names when I click on submit. Can you please help me with this?


Thanks



<html>
<head>


<script>

function addElement()
{
var ni = document.getElementById('myDiv');
var numi = document.getElementById('theValue');
var num = (document.getElementById('theValue').value -1)+ 2;
numi.value = num;
var newdiv = document.createElement('file');
var divIdName = 'my'+num+'Div';
newdiv.setAttribute('id',divIdName);
newdiv.innerHTML = '<input name="name" type="file" id=""/>';
ni.appendChild(newdiv);
}
</script>
</head>
<body>
<?php

if($_POST['submit']=='submit'){
foreach($_FILES['name'] as $x){
echo $x . '<BR>';
}
}

?>
<form method="post" enctype="multipart/form-data">
<input type="hidden" value="0" id="theValue" />
<p><a href="javascript:;" onClick="addElement();">Add Some Elements</a></p>
<div id="myDiv"><input name="name" type="file" id=""/> </div>
<input type="submit" name="submit" value="submit">
</form>
</body>
</html>
JShor
09-18-2009, 10:46 PM
"file" isn't recognized as an html element. You'll need to use "input" and append a "file" attribute to it.



var newdiv = document.createElement('input');
newdiv.setAttribute(newdiv, 'file');
JShor
09-19-2009, 03:56 AM
I didn't read that carefully enough. YOu can't "re-enter" html in an existing html element. Here's a better revised bersion:



function addElement()
{
var ni = document.getElementById('myDiv');
var numi = document.getElementById('theValue');
var num = (document.getElementById('theValue').value -1)+ 2;
numi.value = num;
var newdiv = document.createElement('input');
var divIdName = 'my'+num+'Div';
newdiv.setAttribute('id',divIdName);
newdiv.setAttribute('type','file');
newdiv.setAttribute('name','name');
ni.appendChild(newdiv);
}
thetestingsite
09-19-2009, 04:52 AM
Change the input name to name[] and see if that works for you.

Hope this helps.
cancer10
09-19-2009, 06:04 AM
Yes that works


Thanks :)
cancer10
10-16-2009, 03:10 AM
Hey

I was wondering if there is anyway I can add a "Remove" button for each upload field?