Blur event function in IE11 and IE10

Question

I have a textbox in my ASP.Net MVC application and I need to do some validation when the textbox loses focus, so I have used a blur event.

The below event is working fine in Chrome browser but not working in IE11 and IE10.

Script Code:

$("#NewFileName").on("blur", function () {
alert('triggered');
});

ASP.NET MVC HTML code:

<div class ="span6">
                <p>
                    @Html.TextBoxFor(m => m.FileName, new { type = "file" }) 
                </p>
</div>

I tried with different events like "focusout" for IE, but no focus/blur event are working in IE. What is the correct event for IE10 and 11 browsers?

Answer 1

File input types do not support focus and blur in IE due to security restrictions:

Windows Internet Explorer 8 form submission has been changed so that a file upload control (input type=file) only submits the file path to the server. Previously, the full path was sent to the server. Also, programmatic access to the value property of the file upload control also removes the path information from the file name.

There is no workaround for this feature and it may not be turned off. Providing access to the full path of the file (for Internet and Restricted sites) is a security measure. Stripping out the full path in these instances prevents relatively uncontrolled sites from accessing information that can potentially be exploited.

NewFileName needs to be set as the ID attribute of the textbox:

@Html.TextBoxFor(m => m.FileName, @id = "NewFileName") 

In addition:

In Microsoft Internet Explorer 5 and greater, elements that expose the blur method must have the TABINDEX attribute set.

References

• blur method (Internet Explorer)

• Internet Explorer Application Compatibility: Event 1056 - File Name Restriction

• Internet Explorer 7 and blur (with input type=file) | Matthias Wessendorf's Weblog

• Validate input type=file with onBlur

• Giving EditorFor an ID Attribute