Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New Coder
    Join Date
    Aug 2005
    Posts
    32
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy How to add file input dynamically to the form?

    I found an article about a simliar topic but I had two problems:
    First: the created file input items were not posted to my server, I printed the $_FILES and I found nothing. Is that normal for dynamic HTML controls?
    Second: I tried to validate the file input items using javascript but I failed to reference the dynamic items. I tried using getElementByID and getElementByName but they didn't work too.
    Here is the article:
    http://www.dustindiaz.com/add-and-re...th-javascript/
    Please help.
    Thank you

  • #2
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,075
    Thanks
    0
    Thanked 256 Times in 252 Posts
    You need to show us your code.
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #3
    New Coder
    Join Date
    Aug 2005
    Posts
    32
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Here is the code I use:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Add/Remove child: Javascript</title>
    <script type="text/javascript">
    <!--
    
    function addEvent()
    {
    var ni = document.getElementById('myDiv');
    var numi = document.getElementById('theValue');
    var num = (document.getElementById("theValue").value -1)+ 2;
    numi.value = num;
    var divIdName = "my"+num+"Div";
    var newdiv = document.createElement('div');
    newdiv.setAttribute("id",divIdName);
    newdiv.innerHTML = "File: <input type='file' id='myfile[] name='myfile[]'> <a href=\"javascript:;\" onclick=\"removeEvent(\'"+divIdName+"\')\">Remove</a>";
    ni.appendChild(newdiv);
    }
    
    function removeEvent(divNum)
    {
    var d = document.getElementById('myDiv');
    var olddiv = document.getElementById(divNum);
    d.removeChild(olddiv);
    var numi = document.getElementById('theValue');
    numi.value = numi.value - 1;
    }
    
    
    function validate ()
    {
      //alert ('hi');
      //var ni = document.getElementById('myfile');
      //alert(ni); 
      return true;
    }
    
    //-->
    </script>
    </head>
    
    <body>
    <form method='post' action='js3_action.php' name='form1' onsubmit='return validate()'>
    	<input type="hidden" value="0" id="theValue" name='theValue'/>
    	<p><a href="javascript:;" onclick="addEvent();">Add Some Elements</a></p>
    	<div id="myDiv"> <script type="text/javascript">addEvent(); </script></div>
    <input type='submit' name='submit'>
    </form>
    </body>
    </html>

  • #4
    Supreme Master coder! glenngv's Avatar
    Join Date
    Jun 2002
    Location
    Philippines
    Posts
    11,075
    Thanks
    0
    Thanked 256 Times in 252 Posts
    You missed the closing quote in the id attribute causing the name attribute to be part of the id value. So you were submitting a field with no name.
    Code:
    newdiv.innerHTML = "File: <input type='file' id='myfile[]' name='myfile[]'> <a href=\"javascript:;\" onclick=\"removeEvent(\'"+divIdName+"\')\">Remove</a>";
    Glenn
    ____________________________________

    My Blog
    Tower of Hanoi Android app (FREE!)
    Tower of Hanoi Leaderboard
    Samegame Facebook App
    vBulletin Plugins
    ____________________________________

  • #5
    New Coder
    Join Date
    Aug 2005
    Posts
    32
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy

    That didn't work too, I still get nothing when the script is posted.

  • #6
    Senior Coder CFMaBiSmAd's Avatar
    Join Date
    Oct 2006
    Location
    Denver, Colorado USA
    Posts
    3,122
    Thanks
    2
    Thanked 327 Times in 319 Posts
    The <form tag needs the following parameter in order for file uploads to work -
    Code:
    enctype="multipart/form-data"
    If you are learning PHP, developing PHP code, or debugging PHP code, do yourself a favor and check your web server log for errors and/or turn on full PHP error reporting in php.ini or in a .htaccess file to get PHP to help you.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •