Validate Selection of Files for Upload

Environment

Product Progress Kendo UI Upload
Operating System All
Browser All
Preferred Language JavaScript

Description

How can I validate if a file is selected for upload when working with the Upload?

Solution

Use a custom rule in the Kendo UI Validator to validate on form submission whether a file in the Upload was selected.

    <form id="myForm" action="https://demos.telerik.com/kendo-ui/upload/submit" enctype="multipart/form-data" method="post">
        <input id="files" name="files" type="file"/>
        <input type="submit" />    
    </form>

    <script>
        $("#files").kendoUpload();

        var fileNotSelected = false;

        var validator = $("#myForm").kendoValidator({
            rules: {
            upload: function(input) {
                if (input[0].type == "file") {
                fileNotSelected = true;
                var len = input.closest(".k-upload").find(".k-file").length;

                return len > 0;
                }

                return true;
            }
            }
        }).data("kendoValidator");

        $("#myForm").submit(function(e) {
            $("#files").removeAttr("disabled");

            if(!validator.validate()) {
            if(fileNotSelected) {
                fileNotSelected = false;
            }
            e.preventDefault()
            }
        });  
    </script>
In this article
Not finding the help you need? Improve this article