Results 1 to 9 of 9

Thread: how to refresh a field and not all form?

  1. #1
    Join Date
    Sep 2007
    Posts
    58
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question how to refresh a field and not all form?

    Code:
    <form name="formData">
    <input type="file" name="FILE1" onchange="setdumy(value)">
    </form>
    i got this form for example...its name "formdata"

    when i want to clean=reset all the form i will use
    Code:
    formData.reset();
    what is the command to reset the specific field of of the file called FILE1
    ?

  2. #2
    Join Date
    Mar 2006
    Location
    Illinois, USA
    Posts
    12,164
    Thanks
    265
    Thanked 690 Times in 678 Posts

    Default

    Reset to nothing? Something like--
    generalproperty.file1.value=''; this.value='';
    Daniel - Freelance Web Design | <?php?> | <html>| español | Deutsch | italiano | português | català | un peu de français | some knowledge of several other languages: I can sometimes help translate here on DD | Linguistics Forum

  3. #3
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    If it were a text input:

    Code:
    document.forms['formData']['FILE1'].value='';
    However, you are not (at least in most modern browsers) allowed for security reasons to mess with the value of a file input. If you need to reset just one file input at a time, use multiple forms, one for each file input, and reset it's particular form.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  4. #4
    Join Date
    Mar 2006
    Location
    Illinois, USA
    Posts
    12,164
    Thanks
    265
    Thanked 690 Times in 678 Posts

    Default

    I suppose you could kill that then rewrite it.
    div.innerHTML = '<new file input>';
    Daniel - Freelance Web Design | <?php?> | <html>| español | Deutsch | italiano | português | català | un peu de français | some knowledge of several other languages: I can sometimes help translate here on DD | Linguistics Forum

  5. #5
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Quote Originally Posted by djr33 View Post
    I suppose you could kill that then rewrite it.
    div.innerHTML = '<new file input>';
    This might be one instance where the habit of innerHTML to obliterate form data might be useful, provided browsers will allow it and execute it as desired.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  6. #6
    Join Date
    Sep 2007
    Posts
    58
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question people its not working

    for example lets take :
    Code:
    <form method=post name=upform action="/cgi-bin/some-script.cgi" enctype="multipart/form-data">
    <input type=file name=uploadfile1 onchange="LimitAttach(this.form, this.form.uploadfile1.value)">
    <input type=file name=uploadfile2 onchange="LimitAttach(this.form, this.form.uploadfile2.value)">
    <input type=file name=uploadfile3 onchange="LimitAttach(this.form, this.form.uploadfile3.value)">
    <input type=button name="Submit" value="Submit">
    </form>
    calls function
    Code:
    function LimitAttach(form, file) {
    ???????
    }
    what i have to write there in order to reset the field of the choosen file?

    document.formData.value='';
    generalproperty.file1.value=''; this.value='';
    document.getElementById(FILE).value='';


  7. #7
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    First of all, there isn't much point passing so much data to LimitAttach(). This will suffice:

    Code:
    <input type=file name=uploadfile1 onchange="LimitAttach(this)">
    You can get all that other stuff you may need once LimitAttach() has the input element as represented by its this keyword:

    Code:
    function LimitAttach(el) {
    var thevalue=el.value;
    /*do whatever you like with thevalue here*/
    //now we can remove and replace the input:
    var newinput=document.createElement('input');
    newinput.name=el.name;
    newinput.type='file';
    newinput.onchange=function(){LimitAttach(this);};
    el.form.replaceChild(newinput,el);
    }
    Notes: I tested this in Opera, FF, and IE. In Opera, thevalue only contained the filename, not the path. In the others, thevalue contained the full path and filename. In all three, the variable thevalue retained its value even after the input was replaced. There could be memory leaks in IE. You might want to set el to null or something like that after retrieving its value and replacing it.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  8. #8
    Join Date
    Sep 2007
    Posts
    58
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up first of all thank you for the replay:)

    i psot this msg without all the script..its realy long and boring and not relevant...the 2 data i send is for this script...
    wrote onchange="LimitAttach(this.form, this.form.uploadfile1.value)
    if i will use you script i will need to add third data
    onchange="LimitAttach(this.form, this.form.uploadfile1.value, this)

    about the script ittself it is very interesting realy i have never thought about this direction...but all i wanted when i said reset\clean is realy to clean...that it will be empty...

    thank you again for you help

  9. #9
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    In my version of LimitAttach() called with:

    Code:
    <input type=file name=uploadfile1 onchange="LimitAttach(this)">
    this.form would be represented by el.form. this.form.uploadfile1.value would be represented by el.value.

    Try this:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script type="text/javascript">
    function LimitAttach(el) {
    var thevalue=el.value;
    /*do whatever you like with thevalue here*/
    alert(thevalue);
    alert(el.form.innerHTML);
    //now we can remove and replace the input:
    var newinput=document.createElement('input');
    newinput.name=el.name;
    newinput.type='file';
    newinput.onchange=function(){LimitAttach(this);};
    el.form.replaceChild(newinput,el);
    }
    </script>
    </head>
    <body>
    <form method=post name=upform action="/cgi-bin/some-script.cgi" enctype="multipart/form-data">
    <input type=file name=uploadfile1 onchange="LimitAttach(this)"><br>
    <input type=file name=uploadfile2 onchange="LimitAttach(this)"><br>
    <input type=file name=uploadfile3 onchange="LimitAttach(this)"><br>
    <input type=button name="Submit" value="Submit">
    </form>
    </body>
    </html>
    You will see that the input, its value, and its form are all available from its this keyword.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

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