PDA

View Full Version : 2 File fields, change one, other changes itself to match

hevydani
01-29-2008, 07:24 PM
Hey there,
I have been dabbling in a bit of javascript, My aim is this...

I have two file input fields (for uploading), I wish to browse for my first file,
Using file field "A", and for file field "b" to change to match it.

I have come up with this so far, but still, it will not work, Any help appreciated.....

(file-A/B are just for example)

<label for="file"><strong>File :</strong></label>
<input id="file" name="file" type="file" value="" size="40" onChange="copy ();" />


------and the script itself--------

<script type="text/javascript">
function copy (){
x = document.getElementById('file-A');
document.getElementById('file-B').value = x;
}
</script>
rangana
01-29-2008, 07:38 PM
<script type="text/javascript">
function copy (){
x = document.getElementById('file-A');
document.getElementById('file-B').value = x;
}
</script>
Little confused (nothing new about it), Where is 'file-A' and 'file-B'??.
ElementbyId method returns a reference to the first object with the specified ID.
You only have the id 'file'.
hevydani
01-29-2008, 10:43 PM
file "A" being field "A" (1st file field or "browse")

"B" being the file field which i want to auto update so it has the same path as "A"

Its so i can upload to same file to 2 different sites.

i used this script to change a text box to contain the file name excluding the path...

this is the file input or "browse" field

<label for="file"><strong>File :</strong></label>
<input id="file" name="file" type="file" value="" size="40" onChange="completion();" />



And this is the relevant "onChange="completion();" " script which works....

function completion (){
x = document.getElementById('file').value;
x = x.replace(/\//g, '\\');
x = x.replace(/_/g, ' ');
x = x.replace(/\./g, ' ');
x = x.replace(/\[1\]/g, '');
x = x.substring(x.lastIndexOf('\\') + 1, x.length - 8);
document.getElementById('name').value = x;
document.getElementById('form-name').value = x +;
document.getElementById('cat').focus();
}


thats what i based this script on

Thanks for replying :)
coothead
01-30-2008, 03:43 AM
Hi there hevydani,

I am afraid that what you are trying to do, cannot be done. :disagree:
You were told this by our resident technical administrator scoutt two or three days ago.......
http://www.htmlforums.com/html-xhtml/t-file-inputs-in-forms-x-changes-yz-99791.html

If you are still unconvinced, then check out this example...

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">
input {
margin:5px;
}
</style>

<script type="text/javascript">
window.onload=function() {
var df=document.forms[0];
df[3].onclick=function() {

df[0].value=df[1].value; /* code to set text input to file A value*/

df[2].value=df[1].value; /* code to set file B value to file A value*/

alert('input type="text" value='+df[0].value);
alert('file A value='+df[1].value);
alert('file B value='+df[2].value);

}
}
</script>

</head>
<body>

<form action="http://www.google.com/" method="get">
<div>

<input type="text" name="C"><label>test for value transfer</label>

<input type="file" name="A"><label>file A</label>
<input type="file" name="B"><label>file B</label><br>

<br>

<input type="button" value="test A to B">
<input type="submit">

</div>
</form>

</body>
</html>
hevydani
01-30-2008, 05:18 AM
ok thanks for replying, i thought it may be possible with javascript as a pose to HTML is all, Thanks again : )
coothead
01-30-2008, 06:06 AM
No problem, you're very welcome. :agree:
<h1>
01-30-2008, 12:24 PM
For what reason do you want to achieve this? I'm thinking you could use 1 file input and use javascript to add the same file path twice to the fille[] array.
Not too clued up on how this can be done, other than using a JS framework like jquery.
Have a look here to see how this can be done using javascript: http://www.fyneworks.com/jquery/multiple-file-upload/
In any case it would be a whole bunch more practical to copy the file once it has been uploaded on the server, rather than to upload it twice.