how to add file filter option in javascript

5 posts, 0 answers
  1. Heera
    Heera avatar
    10 posts
    Member since:
    Dec 2011

    Posted 01 Mar 2013 Link to this post

     <telerik:RadAsyncUpload ID="uplFilenameNew" runat="server">
                         
                         
                        </telerik:RadAsyncUpload>


    how to add file filter option in javascript depending on combobox item (pdf,spreadsheet,text,jpeg)

    thank you.

    please help me.
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 29 Oct 2013 Link to this post

    Hi Heera,

    Please have a look into the following sample code I tried from server side for your scenario.

    ASPX:
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadComboBox1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadAsyncUpload1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <telerik:RadComboBox ID="RadComboBox1" runat="server" AutoPostBack="true" EmptyMessage="Select"
        OnSelectedIndexChanged="RadComboBox1_SelectedIndexChanged">
        <Items>
            <telerik:RadComboBoxItem runat="server" Text="All Formats" />
            <telerik:RadComboBoxItem runat="server" Text="PDF" />
            <telerik:RadComboBoxItem runat="server" Text="SpreadSheet" />
            <telerik:RadComboBoxItem runat="server" Text="Text" />
            <telerik:RadComboBoxItem runat="server" Text="JPEG" />
        </Items>
    </telerik:RadComboBox>
    <br />
    <telerik:RadAsyncUpload ID="RadAsyncUpload1" runat="server">
    </telerik:RadAsyncUpload>

    C#:
    protected void RadComboBox1_SelectedIndexChanged(object sender, Telerik.Web.UI.RadComboBoxSelectedIndexChangedEventArgs e)
    {
        string filetype = RadComboBox1.SelectedItem.Text;
        switch (filetype)
        {
            case "PDF":
                RadAsyncUpload1.AllowedFileExtensions = new string[] { ".pdf" };
                break;
            case "SpreadSheet":
                RadAsyncUpload1.AllowedFileExtensions = new string[] { ".xls", ".xlsx", ".ods" };
                break;
            case "Text":
                RadAsyncUpload1.AllowedFileExtensions = new string[] { ".txt" };
                break;
            case "JPEG":
                RadAsyncUpload1.AllowedFileExtensions = new string[] { ".jpg", ".jpeg" };
                break;
            default:
                RadAsyncUpload1.AllowedFileExtensions = new string[] { };
                break;
        }
    }

    Thanks,
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Sameer
    Sameer avatar
    20 posts
    Member since:
    Apr 2013

    Posted 30 Oct 2013 Link to this post

    Hello Princy. I was looking for this scenario and found your code. Your code works well in IE but not in Firefox. I am using FireFox 23. Can you please come up with a fix for this?
  5. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 30 Oct 2013 Link to this post

    Hi Sameer,

    By default Firefox is using FileApi module.But FileFiltering will work with Silverlight/flash module only. This is one limitation of the FileApi module. So you need to disable the FileApi module for that please add the following Code to the JavaScript.

    JavaScript:
    <script type="text/javascript">
        Telerik.Web.UI.RadAsyncUpload.Modules.FileApi.isAvailable = function () { return false; }
    </script>

    Thanks,
    Princy.
  6. Sameer
    Sameer avatar
    20 posts
    Member since:
    Apr 2013

    Posted 30 Oct 2013 Link to this post

    Thanks. It worked great.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017