ValidationMessage для отображения на Chrome, но не на IE11

Question

Вот как это выглядит в браузере: Это проверка , то есть не показывает :

@Html.EditorFor(model => model.StrTitle, new { htmlAttributes = new { @class = "form-control", @onfocusout = "validateTitleTextBox(this);", @onfocus = "clearErrorMessage(this)" } })
@Html.ValidationMessageFor(model => model.StrTitle, "", new { @class = "invalidData" })

Это проверка , которую показывает :

@Html.EditorFor(model => model.StrUseCaseSPAFullName, new { htmlAttributes = new { @class = "form-control", @id = "autocompleteTextBox", @onfocusout = "validateSPATextBox(this); fillSPAField();", @onfocus = "clearErrorMessage(this)" } })
@Html.ValidationMessageFor(model => model.StrUseCaseSPA, "", new { @class = "invalidData" })

Это модель :

[Display(Name = "Use Case SPA")]
[Required(ErrorMessage = "The Use Case SPA field is required")]
public string StrUseCaseSPA { get; set; }

[Display(Name = "Use Case SPA")]
public string StrUseCaseSPAFullName {get; set;}

[Display(Name = "Use Case Title")]
[Required(ErrorMessage = "The Use Case Title field is required")]
public string StrTitle { get; set; }

Shared Layout имеет заголовок IE11 X-UA-совместимый и содержит все пакеты, необходимые для отображения проверки

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta http-equiv="X-UA-Compatible" content="IE=11">

JavaScript функция вызывается из EditorFor :

//SPA - field validation
function validateSPATextBox(field) {
    if (field.value == "") {
        field.value = "Please Enter a Name for the SPA of the Use Case";
        $('#' + field.id).addClass("invalidData");
        arrFieldError.push(field.id);
    }
    else {
        var errorIndex = arrFieldError.indexOf(field.id);
        if (errorIndex != -1)
            arrFieldError.splice(errorIndex, 1);
   }
}

//Use Case Title - field validation
function validateTitleTextBox(field) {
    if (field.value == "") {
        field.value = "Please enter Title for the Use Case";
        $('#' + field.id).addClass("invalidData");
        arrFieldError.push(field.id);
    }
    else {
        var errorIndex = arrFieldError.indexOf(field.id);
        if (errorIndex != -1)
        arrFieldError.splice(errorIndex, 1);
    }
}