resetting input file using $(this).val("") not working with IE8

Question

Possible Duplicate:
IE 9 jQuery not setting input value

I would like to reset the input field if it matches some conditions using $(this).val("");:

$(".checkimgextension").on("change", function () {

var file = $(this).val();

if (some conditions){
  alert("wrong:...");
  $(this).val("");
}

With Firefox the field is set to "", but with IE the field does not change as expected. Am using the right function .val("")?

In your title, you say "file" -- you mean really mean `input type="file"`? — T.J. Crowder, Dec 06 '12 at 14:14
Guys it's very likely to be a "file" input, and you can't set its value from JavaScript in IE. — Pointy, Dec 06 '12 at 14:15

score 8 · Answer 1 · edited May 23 '17 at 11:47

Refer to this: IE 9 jQuery not setting input value

$("input[type='file']").replaceWith($("input[type='file']").clone(true));

So in your case:

$(this).replaceWith($(this).clone(true));

instead of the $(this).val(""); line.

UPDATE:

In order to take advantage of browsers that allow you to modify the input:file element, I would use something like this:

$(".checkimgextension").on("change", function () {
    var $this = $(this);

    if (some conditions) {
        alert("wrong:...");
        $this.val("");
        var new_val = $this.val();
        if (new_val !== "") {
            $this.replaceWith($this.clone(true));
        }
    }
});

That way, it attempts to just set the value to empty at first, and if that doesn't succeed, use the replaceWith method.

Updated to avoid `replaceWith` when possible – Ian Dec 06 '12 at 17:26 — Ian, Dec 06 '12 at 17:26

resetting input file using $(this).val("") not working with IE8

1 Answers1