AsyncUpload Validation

6 posts, 0 answers
  1. Silviu
    Silviu avatar
    50 posts
    Member since:
    Feb 2015

    Posted 10 Feb Link to this post

    I am trying to get some validation done. When a user selects the wrong file type I can see the red dot beside the file but when I click submit the postback happens anyway regardless if the file is an Xlsx or not.

    I would like to display an error message without postback as the asp.net built in validation can do.

     See below for test code:

     <telerik:RadAsyncUpload ID="RadAsyncUpload1" runat="server" AllowedFileExtensions="Xlsx" MultipleFileSelection="Disabled" ValidateRequestMode="Enabled" ValidationGroup="TEST" MaxFileInputsCount="1">
    </telerik:RadAsyncUpload>
    <telerik:RadButton ID="RadButton1" runat="server" Text="Submit" ValidationGroup="TEST" OnClick="RadButton1_Click"></telerik:RadButton>
    <asp:ValidationSummary runat="server" DisplayMode="BulletList" ShowSummary="true" ShowValidationErrors="true" ShowMessageBox="true" ValidationGroup="TEST" />

     

  2. Silviu
    Silviu avatar
    50 posts
    Member since:
    Feb 2015

    Posted 10 Feb in reply to Silviu Link to this post

    Forgot to mention that even though I have selected .XLSX as the only allowed types, in the File Explorer pop up it is still set to All Files (*.*). It does turn red if other than xlsx file type is selected but I want to restrict the selection also.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Ivan Danchev
    Admin
    Ivan Danchev avatar
    829 posts

    Posted 12 Feb Link to this post

    Hello Silviu,

    You can prevent the postback by subscribing to the RadAsyncUpload's OnClientValidationFailed event and the RadButton's OnClientClicking and cancelling the Button's click event if the validation has failed:
    var pageIsValid = true;
     
    function OnClientValidationFailed(sender, args) {
        pageIsValid = false;
    }
     
    function OnClientClicking(sender, args) {
        if (!pageIsValid) {
            alert("Invalid file format!");
            args.set_cancel(true);
        }
    }

    As for showing only .xlsx files in the select dialog window, you can achieve that by setting the accept attribute to the AsyncUpload's input element as shown below:
    function pageLoad() {
        $telerik.$(".RadAsyncUpload input").attr("accept", ".xlsx");
    }

    Regards,
    Ivan Danchev
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  5. Silviu
    Silviu avatar
    50 posts
    Member since:
    Feb 2015

    Posted 19 Feb in reply to Ivan Danchev Link to this post

    Thank you, I can see Xlsx as part of the option list.

    But I still have options of All Files, Pictures and HTML alongside the Xlsx.

    I need for xlsx to be the only allowed option.

    How would I set that?

  6. Ivan Danchev
    Admin
    Ivan Danchev avatar
    829 posts

    Posted 22 Feb Link to this post

    Hello Silviu,

    You will not be able to hide the other options, because this is browser-specific behavior which we do not have control over, regardless of using the AsyncUpload or the <input type="file" /> HTML element. The filtering of the files through the "accept" attribute is added for convenience, not to limit the users preventing them from selecting other file types.

    Regards,
    Ivan Danchev
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  7. Silviu
    Silviu avatar
    50 posts
    Member since:
    Feb 2015

    Posted 22 Feb in reply to Ivan Danchev Link to this post

    Ok thank you for clearing that up.

    It is not a deal breaker so not a problem.

Back to Top
UI for ASP.NET Ajax is Ready for VS 2017