c# - 通过上传文件进行自定义客户端验证

Question

我正在使用客户端验证创建自己的数据注释，以检查是否允许选择的文件，但我无法让它工作。客户端方法不会被触发。

我没有收到任何 JavaScript 错误。

型号:

public class FotoAlbumModel
{
    public int AlbumId { get; set; }

    [Filters.Required]
    [MaxLength(150, ErrorMessage = "Dit veld mag niet langer zijn dan 150 tekens.")]
    public string Titel { get; set; }

     [Filters.Required]
    [MaxLength(150, ErrorMessage = "Dit veld mag niet langer zijn dan 2500 tekens.")]
    public string Descriptie { get; set; }

    [Filters.Required]
    [MaxLength(250, ErrorMessage = "Dit veld mag niet langer zijn dan 250 tekens.")]
    public string Keywoorden { get; set; }

    [Filters.Required]
    [LinkName]
    public string Linknaam { get; set; }

    public bool Status { get; set; }

    public int AantalFotos { get; set; }

  [Filters.FileExtensions(FileExtensions = ".bmp,.jpg,.png.gif,.jpeg")]
    public HttpPostedFileBase[] Fotos { get; set; }
}

我的注释:

public class FileExtensionsAttribute : ValidationAttribute, IClientValidatable
{
    public string FileExtensions { get; set; }

    public override bool IsValid(object value)
    {
        string strValue = value == null ? "" : value.ToString();

        string[] arrayFileExtensions = FileExtensions.Split(',');

        bool isMatch = arrayFileExtensions.Any(x => x.Contains(Path.GetExtension(strValue)));

        if (!isMatch && ErrorMessage == null)
        {
            ErrorMessage = "De extensie van de bestand is niet toegestaan.";
        }
        return isMatch;
    }

    public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
    {
        var rule = new ModelClientValidationRule
        {
            ErrorMessage = "De extensie van de bestand is niet toegestaan.",
            ValidationType = "fileextension"

        };
        rule.ValidationParameters.Add("allowedextensions", FileExtensions);

        yield return rule;
    }
}

我的自定义验证适配器:

$.validator.unobtrusive.adapters.addSingleVal("fileextension", "allowedextensions");

$.validator.addMethod("fileextension", function (value, element, allowedextensions) {
alert('sds');
var arrayAllowedExtensions = allowedextensions.split(',');
var fileExtension = value.split('.').pop();
$.each(arrayAllowedExtensions, function(extension) {
    if (extension == fileExtension) {
        return true;
    }
});
return false;
});

HTML:

   @Html.TextBoxFor(m=> m.Fotos, new {@type="file", @multiple="true", @onchange="makeFileList();", @id="filesToUpload", @style="display: none;"})
                                <input type="button" value="Plaatje(s) selecteren" class="btn btn-green btn-gradient" onclick="document.getElementById('filesToUpload').click();" />
                            <ul id="fileList">
                                <li>No Files Selected</li>
                            </ul>
                            @Html.ValidationMessageFor(m => m.Fotos)

MakeFileList Javascript 函数:

<script>
    function makeFileList() {
        var input = document.getElementById("filesToUpload");
        var ul = document.getElementById("fileList");
        while (ul.hasChildNodes()) {
            ul.removeChild(ul.firstChild);
        }
        for (var i = 0; i < input.files.length; i++) {
            var li = document.createElement("li");
            li.innerHTML = input.files[i].name;
            ul.appendChild(li);
        }
        if(!ul.hasChildNodes()) {
            var li = document.createElement("li");
            li.innerHTML = 'No Files Selected';
            ul.appendChild(li);
        }
    }
</script>

为什么没有启动该方法有任何想法吗？

Answer 1

我认为这是因为您隐藏了 FileExtensionsAttribute 代码试图验证的控件。

使用 Firebug 查看您的页面，您可以看到隐藏控件 <input id="filesToUpload" type="file"有验证 data-val-fileextension="De extensie van de bestand is niet toegestaan."

如果您修改文本框 @Html.TextBoxFor(m=> m.Fotos通过删除 @style="display: none;"属性，您将看到您的验证有效。

不幸的是，我不确定如何解决这个问题。您有什么理由不能使用标准文件上传控件吗？