Validate Upload control in Kendo UI

Validate Upload control in Kendo UI

//This is kendo ui upload property class with Required validation attribute.
public class Upload
{
    [Required(ErrorMessage = "Please select files for upload.")]
    public HttpPostedFileBase file { get; set; }

}

//This is upload file control with kendo ui mvc 5.
<div id="IsValid">
@using (Html.BeginForm("Upload", "UploadController", FormMethod.Post, new { id = "UploadId", enctype = "multipart/form-data"}))
{
        @(Html.Kendo().Upload()
            .Name("files")
            .Multiple(false)
            .HtmlAttributes(new { required = true })
        )        
        @Html.ValidationMessageFor(m => m.file)
        <button class="k-button" id="btnUpload" type="submit">Submit</button>
}
</div>


//This is javascript code for validate Kendo().Upload() controle.
<script type="text/javascript">
    $(document).ready(function () {
        var isVaid = $("#IsValid").kendoValidator().data("kendoValidator");
        $("#btnUpload").click(function (e) {

            if ($("#files").parent().siblings("ul").length > 0) {
                $("#files").removeAttr("required");
            }

            if (!isVaid.validate()) {
                e.preventDefault();
            }
        });
    });
</script>


ANIL SINGH

Anil Singh is an author, tech blogger, and software programmer. Book writing, tech blogging is something do extra and Anil love doing it. For more detail, kindly refer to this link..
My Blogs - https://code-sample.com and https://code-sample.xyz
My Book1 - BEST SELLING ANGULAR BOOK (INCLUDING ALL VERSIONS 2, 4, 5, 6, 7)
My Book2 - ANGULAR 2 INTERVIEW QUESTIONS BOOK - Both Books are Available on WorldWide.

www.code-sample.com/. Powered by Blogger.