conditional dropzone

3 posts, 0 answers
  1. moegal
    moegal avatar
    278 posts
    Member since:
    Jul 2007

    Posted 08 Aug 2013 Link to this post

    Is there a "supports drag and drop" property?  I only want to show drop zone if the browser supports it.

    Thanks,  Marty
  2.
  3. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 08 Aug 2013 Link to this post

    Hi moegal,

    The Drag and Drop functionality relies on the HTML5 File API and Drag-And-Drop modules, which means that it works in modern browsers only: Firefox 4+, Google Chrome, IE10, Safari 5+. So one option is you can check whether the File Api is available in your browser and if it is not available you can hide the drop zone and display a custom message. Please check the following code I tried which works fine at my end.

    ASPX:

    <div class="async-drop-zone">
        <telerik:RadAsyncUpload runat="server" ID="RadAsyncUpload1" DropZones=".DropZone1"
            MultipleFileSelection="Automatic" />
        <div class="DropZone1">
            <p>
                Custom Drop Zone</p>
            <p>
                Drop Files Here</p>
        </div>
    </div>

    JavaScript:
    <script type="text/javascript">
        //<![CDATA[
        var $ = $telerik.$;
        function pageLoad() {
            if (!Telerik.Web.UI.RadAsyncUpload.Modules.FileApi.isAvailable()) {
                $(".async-drop-zone").html("<strong>Your browser does not support Drag and Drop. Please take a look at the info box for additional information.</strong>");
            }
        //]]>
    </script>

    CSS:
    <style type="text/css">
        .DropZone1
        {
            width: 300px;
            height: 90px;
            background-color: #357A2B;
            border-color: #CCCCCC;
            color: #767676;
            text-align: center;
            font-size: 16px;
            color: white;
        }
    </style>

    Thanks,
    Shinu.

  5. moegal
    moegal avatar
    278 posts
    Member since:
    Jul 2007

    Posted 09 Aug 2013 Link to this post

    Shinu,

    thanks, I will try it this weekend.

    Marty
Back to Top