Question

I have the following jquery function :

makeupload = function() {
    if (filecount == 7) {
        alert('You can Only upload up to 10 files');
    } else {
        filecount++;
        var el = $('div#fileupload');
        el = el[el.length - 1];
        el = $(el);
        var nel = el.clone();
        nel.val('');
        var fi = nel.find("#fileinput");
        fi.attr("name", "file[]");
        fi.val('');
        el.after(nel);
        nel.show();
        fi.bind("change", function(e) {
            makeupload();
        });
    }
}
makeupload();

in firefox only it replicates the value of the last field, so if I browse an image and then add a new field using the function above, it replicates the value inside the field for the new one.

here is the html file :

<div id="fileupload" style=""><input type="file" name="file[]" /><br /></div>

Answer 1

I don’t know what the current state of your code is (the code above can’t work as it is at least), so I took the liberty to refactor your function. I also removed the ID attribute from the mark–up and replaced it with a class attribute, since you really shouldn’t be cloning IDs.

The following version seems to work just fine in FF:

var max_upload = 10;

var make_upload = function() {
    var $uploads = $(".fileupload");

    if ($uploads.length >= max_upload) {
        alert("You can only upload up to 10 files");

    } else {
        var $last = $uploads.last();

        $last
            .clone()
            .insertAfter($last)
            .find("input")
            .val("")
            .bind("change", function() {
                make_upload();
            });
    }
}

make_upload();