/    Sign up×
Community /Pin to ProfileBookmark

createElement("input")

Copy linkTweet thisAlerts:
Jan 31.2008

Hello,

I have a <p id=’newimage’></p> area in which I create a file input area after a user has clicked ‘add img’ using this function:
(snippet)

function changeimg(){
para = document.getElementById(“newimage”);
imgBox = document.createElement(“input”);
imgBox.type = file;
imgBox.name = image;
para.appendChild(imgBox);
}

The input area gets created fine. Trouble is, when the form gets submitted, there is no post data for any $FILES[‘image’][‘name’] !!
I have my enctype in the form header & I tried using a normal <input type=’file’ name=’image’> and that works fine. So why doesn’t the one I create with the javascript work??
*puzzled*

any help is great ?

to post a comment
JavaScript

7 Comments(s) ↴

Copy linkTweet thisAlerts:
@replicaJan 31.2008 — maybe?

[code=php]
function changeimg() {
para = document.getElementById("newimage");
imgBox = document.createElement("input");
imgBox.type = file;
//imgBox.name = image;
imgBox.name = 'image';
para.appendChild(imgBox);
}[/code]
Copy linkTweet thisAlerts:
@A1ien51Jan 31.2008 — I bet this is hapening in IE.

IE does not let you set the name for some odd reason.

Take a look at this to see how to get around the issue:

http://www.pascarello.com/examples/createElement.html

Eric
Copy linkTweet thisAlerts:
@toenailsinJan 31.2008 — IE was setting the name field for me....

heres what i used:

[CODE]<html>
<head>
<title>Blah</title>
<script><!--

function Init(){
var Form = document.getElementById('Form')
var Box = document.createElement('input');
Box.type = 'file';
Box.name = 'image';
Form.appendChild(Box);
}
window.onload = Init;

--></script>
</head>
<body>

<form enctype="multipart/form-data" id="Form" method="post" action=".">
<input type="submit">
</form>


<?

print_r($_FILES);

?>


</body>
</html>[/CODE]
Copy linkTweet thisAlerts:
@wally_tamauthorJan 31.2008 — Yeah, IE wasn't the problem for me either, I've been testing in Firefox & Safari

It's worked fine for me before. I've used it successfully for <input type='text'> and even created <selects>'s using this method and used the post data no problems. It seems to me to be an issue particular to <input type='file'> and ,naming the object and then accessing it after POST in $_FILES[][]

Thanks replica, I gave it a try but no dice.

This is a tough one but thanks for the help guys ?
Copy linkTweet thisAlerts:
@wally_tamauthorJan 31.2008 — Now here's an interesting twist, I work on a mac normally, so I don't even have IE, but I just got a brief chance to test it and whoa! The ONLY browser it works on is IE!!
Copy linkTweet thisAlerts:
@Arty_EffemFeb 01.2008 — Now here's an interesting twist, I work on a mac normally, so I don't even have IE, but I just got a brief chance to test it and whoa! The ONLY browser it works on is IE!![/QUOTE]Do you have [I]file[/I] and [I]image[/I] in quotes as pointed out already?

If you do then that code should and does work.

Can you conform that your <p></p> is actually within the form?
Copy linkTweet thisAlerts:
@wally_tamauthorFeb 01.2008 — yup, the <p id='newimage'><p> is within a form - which is within a table.

I have tried

imgBox.type = "input";

imgBox.name = "image";

Yes, and alternatively I have tried

imgBox.setAttribute("type","input");

imgBox.setAttribute("name","image");

with just as little success ?
×

Success!

Help @wally_tam spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.1,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...