select button with not show the select files window

11 posts, 0 answers
  1. warren
    warren avatar
    6 posts
    Member since:
    May 2011

    Posted 29 May 2011 Link to this post

    hi, being new to the telerik controls i am having a frustrating problem, and probably a so simple one to fix! when using the radupload control (and the standard .net upload file control) i get no issues, when trying to use the asyncupload control i cannot seem to see why the select file button does not bring the window to select the file from the users machine, i at first thought it could be something to do with the control being inside a multiview so moved the control to a simple aspx page and still the select button didnt work, any ideas would be greatly appreciated.

    Edited: this is only happening with IE9, firefox and chrome are working fine.

    Edited: IE9 in compatibility mode is also working, any advice on how to get this control working for IE9 would be great as the app. is close to being finished.

  2. Dimitar Terziev
    Admin
    Dimitar Terziev avatar
    1084 posts
    Member since:
    Sep 2012

    Posted 01 Jun 2011 Link to this post

    Hello Warren,

    Could you specify which version of our controls you are using, since we are not aware of such a problem with the current version of the RadAsyncUpload.

    Any additional information provided would be helpful.

    Regards,
    Dimitar Terziev
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. warren
    warren avatar
    6 posts
    Member since:
    May 2011

    Posted 01 Jun 2011 Link to this post

    Hi Dimitar,

    v.2010.3.1317.40   is the version i am developing with.

    I have tried numerous configs and it seems to be only IE9 causing the issue, i have also tried wrapping the control in a positioned DIV as per an older post but still the same issue.

    Regards

    Warren.

  4. Fraser Tustian
    Fraser Tustian avatar
    17 posts
    Member since:
    Sep 2012

    Posted 02 Jun 2011 Link to this post

    I'm experiencing what I believe to be the same problem. Specifically...

    • On my development server, it's working fine
    • When I post it to my test server, the "Select" button does not appear to perform any function. Clicking anywhere on the control does not seem to do anything.
    • This behaviour appears to be cross-browser: at the very least, it is not working from my test site on IE9 or Chrome11.
    • I am using 2011.1.315.40

    I'm not desperate yet, and will run quite a bit of exclusion tests - particularly as it is working on one server but not on another - but I came here to see if there was a quick thing that I was missing, and found this comment, so thought I'd add mine.

     

  5. Fraser Tustian
    Fraser Tustian avatar
    17 posts
    Member since:
    Sep 2012

    Posted 02 Jun 2011 Link to this post

    A quick heads up to Warren: after testing on various machines, I found that Silverlight was the common thread. That is, if a system had Silverlight installed, RadAsyncUpload was rendering as Silverlight, and that wasn't working. If they didn't have Silverlight installed, it was rendering as Flash and that was working fine.

    So as a quick workaround, I disabled Silverlight:

    protected void Page_Load(object sender, EventArgs e)
    {
        string script1 = "Telerik.Web.UI.RadAsyncUpload.Modules.Silverlight.isAvailable = function () { return false; };";
        string flashScript = String.Concat("<script type='text/javascript'> ", script1, " </script>");
        this.Page.ClientScript.RegisterStartupScript(this.GetType(), "test", flashScript);
    }

    And it seems to be working fine now, after prelminary testing.

    I'm not sure if this is a problem with my Silverlight installation, but I got an acquaintance in a completely different part of the country to give a simple test page a try, and they were experiencing the same problem.

    In case it helps, the test page that didn't work without Silverlight being blocked was simply:

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AsyncUploadTest.aspx.cs" Inherits="Max7.WebSite.testing.AsyncUploadTest" %>
      
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <RAD:RadScriptManager ID="RadScriptManager1" runat="server" />
        <div>
          
            <RAD:RadAsyncUpload ID="RadAsyncUpload1" runat="server" 
                UploadRequestIdentifier="ae3f860a-7e2d-4488-bbfd-9f8aed4bb787">
            </RAD:RadAsyncUpload>
          
        </div>
        </form>
    </body>
    </html>

    The web.config contained the following sections:

    <httpHandlers>
            <add path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResource" verb="*" validate="false"/>
            <add path="Telerik.RadUploadProgressHandler.ashx" type="Telerik.Web.UI.RadUploadProgressHandler" verb="*" validate="false"/>
            <add path="ChartImage.axd" type="Telerik.Web.UI.ChartHttpHandler" verb="*" validate="false"/>
            <add path="Telerik.Web.UI.SpellCheckHandler.axd" type="Telerik.Web.UI.SpellCheckHandler" verb="*" validate="false"/>
            <add path="Telerik.Web.UI.DialogHandler.aspx" type="Telerik.Web.UI.DialogHandler" verb="*" validate="false"/>
        </httpHandlers>

    (in <system.web><httpHandlers>)

    and

    <handlers>
        <remove name="Telerik_Web_UI_SpellCheckHandler_axd"/>
        <remove name="Telerik_Web_UI_DialogHandler_aspx"/>
        <remove name="Telerik_RadUploadProgressHandler_ashx"/>
        <remove name="Telerik_Web_UI_WebResource_axd"/>
        <add name="Telerik_Web_UI_WebResource_axd" path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResource" verb="*" preCondition="integratedMode"/>
        <add name="Telerik_RadUploadProgressHandler_ashx" path="Telerik.RadUploadProgressHandler.ashx" type="Telerik.Web.UI.RadUploadProgressHandler" verb="*" preCondition="integratedMode"/>
        <add name="ChartImage_axd" path="ChartImage.axd" type="Telerik.Web.UI.ChartHttpHandler" verb="*" preCondition="integratedMode"/>
        <add name="Telerik_Web_UI_SpellCheckHandler_axd" path="Telerik.Web.UI.SpellCheckHandler.axd" type="Telerik.Web.UI.SpellCheckHandler" verb="*" preCondition="integratedMode"/>
        <add name="Telerik_Web_UI_DialogHandler_aspx" path="Telerik.Web.UI.DialogHandler.aspx" type="Telerik.Web.UI.DialogHandler" verb="*" preCondition="integratedMode"/>
    </handlers>

    (in <system.webServer>)

    I'm not sure if that offers any conclusions, but it is a workaround for now.

    Cheers,

    FRASER

  6. Fraser Tustian
    Fraser Tustian avatar
    17 posts
    Member since:
    Sep 2012

    Posted 02 Jun 2011 Link to this post

    PS Running .Net 4.0 on IIS7

  7. warren
    warren avatar
    6 posts
    Member since:
    May 2011

    Posted 02 Jun 2011 Link to this post

    hi fraser, thanks for the work around, unfortunately it didnt seem to resolve the issue with my setup.

    I have also tested (asked other people) on different setups, all points back to IE9 which is obviously an issue which needs to be resolved.

    As a note:
    Could Telerik forum admin please confirm this is indeed an issue or not with the asyncupload control ? if this is something that is not going to be fixed in the short term i will need to redesign the pages involved to use an alternative control.



    Edit: Running .net 4.0 and iis7 aswell.

  8. warren
    warren avatar
    6 posts
    Member since:
    May 2011

    Posted 06 Jun 2011 Link to this post

    after some looking around i noticed a similar problem was being reported on the file upload control, they suggested the fix to be disabling the flash module with the following JS:

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


    This has resolved the issue in IE9 for the asyncupload control also.

    Hope this helps others with the same issue.

    Regards

    Warren.

  9. Dimitar Terziev
    Admin
    Dimitar Terziev avatar
    1084 posts
    Member since:
    Sep 2012

    Posted 07 Jun 2011 Link to this post

    Hello Warren,

    There has been a certain problem with the Flash module in IE9, which is related to the Flash itself.

    This issue will be fixed in the upcoming official Q release.

    You have found the valid workaround for this problem.

    All the best,
    Dimitar Terziev
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  10. Johnny
    Johnny avatar
    2 posts
    Member since:
    Jul 2012

    Posted 10 Jul 2012 Link to this post

    It is not working when the Silverlight not installed, only install Flash, it doesn't allow to select multiple files. but when installed Silverlight it allow to select multiple files but cause other issue as error message below:

    "Microsoft JScript runtime error: Error while uploading, [HtmlPage_NotEnabled]
    Arguments:
    Debugging resource strings are unavailable. Often the key and arguments provide sufficient information to diagnose the problem. See http://go.microsoft.com/fwlink/?linkid=106663&Version=8.1.10411.0&File=System.Windows.Browser.dll&Key=HtmlPage_NotEnabled"


    <%

     

    @ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>

    <%

     

    @ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

    <!

     

     

    DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <

     

     

    html xmlns="http://www.w3.org/1999/xhtml">

    <

     

     

    head id="Head1" runat="server">

     

    <title></title>

     

    <style type="text/css">

     

    /* Hide the fakeInput control */

     

    .ruUploadProgress, li .ruCancel, li .ruRemove

    {

     

    visibility: visible;

    }

     

    li.ruUploading

    {

     

    height: 1px;

    }

     

    .RadUpload .ruFakeInput

    {

     

    display: none;

    }

     

    .ruUploadProgress, li .ruCancel, li .ruRemove

    {

     

    /*visibility: hidden;*/

    }

     

    li.ruUploading

    {

     

    height: 0px;

     

    display: none;

    }

     

    .uloadImg

    {

     

    height: 400px;

     

    width: 650px;

     

    overflow-y: scroll;

     

    border: 1px solid #CCCCCC;

    }

     

    .thumbNails

    {

    }

     

    .thumbNails li

    {

     

    float: left;

     

    list-style-type: none;

     

    margin: 5px;

    }

     

    .submit

    {

    }

     

    .myTest

    {

    }

     

    .myTest li

    {

     

    padding: 0px 5px;

     

    list-style-type: none;

     

    float: left;

    }

     

    </style>

     

    <script type="text/javascript" src="scripts/jquery-1.4.1.min.js"></script>

    </

     

     

    head>

    <

     

     

    body>

     

    <form id="form1" runat="server">

    <%

     

    --<asp:ScriptManager ID="ScriptManager1" runat="server" />--%>

     

    <script type="text/javascript">

    Telerik.Web.UI.RadAsyncUpload.Modules.Flash.isAvailable =

     

    function ()

    {

     

    return false; };

     

    </script>

     

    <telerik:RadScriptManager runat="server">

     

    </telerik:RadScriptManager>

     

    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

     

    <script type="text/javascript">

    //<![CDATA[

     

    var isDuplicateFile = false;

     

    var $ = $telerik.$;

    $().ready(

     

    function () {

     

    if (document.getElementById("imgContainer") == null)

    $(

     

    '#RadAsyncUpload1').append($telerik.$('<div id="imgContainer" class="uloadImg">').append('<ul class="myTest">'));

    });

     

     

    function fileUploaded(sender, args) {

     

    debugger;

     

    //Truncate the name

     

    if (isDuplicateFile == false) {

    truncateName(args);

     

    //Display the picture

     

    // var $row = $telerik.$(args.get_row());

     

    // var id = args.get_fileInfo().TempFileLocation;

     

    // $row.append($telerik.$("</br><img width='180px' />")

     

    // .attr("src", getImageUrl(id)));

     

    // var $row = $telerik.$(args.get_row());

     

    var id = args.get_fileInfo().TempFileLocation;

     

    // var $thumbContainer = $('thumbNails');

     

    // var $imgThumb = $telerik.$("<img width='180px' />").attr("src", getImageUrl(id));

     

    // $('.thumbNails').append($telerik.$("<li>").append($telerik.$("<img width='180px' />").attr("src", getImageUrl(id))));

     

    //var $myClass = $('myTestClass');

     

     

    var $img = $telerik.$("<img height='120px' />").attr("src", getImageUrl(id));

     

    var $row = $telerik.$(args.get_row());

    $telerik.$($row).removeClass(

     

    "ruUploading");

     

    var id = args.get_fileInfo().TempFileLocation;

     

    // if (document.getElementById("myTest") == null)

     

    // $('#imgContainer').append($telerik.$('<ul id="myTest" >').append($row));

     

    // else

     

    // $('#myTest').append($row);

     

    $row.find(

     

    '.ruFileWrap').before($img).before("<br />");

    $(

     

    '#imgContainer > ul').append($row);

     

    }

     

    //$('#RadAsyncUpload1').append($telerik.$("<ul>").append($row));

     

     

    // $('myClass').append($ul);

     

    // $('#myInput').append($telerik.$("<li>").append($telerik.$("<img width='180px' />").attr("src", getImageUrl(id))));

     

    // $('#myInput').append($row);

    }

     

    function truncateName(args) {

     

    var $span = $telerik.$(".ruUploadProgress", args.get_row());

     

    var text = $span.text();

     

    if (text.length > 16) {

     

    var newString = text.substring(0, 16) + '...';

    $span.text(newString);

    }

    }

     

     

    function FileSelected(sender, args) { //Single file

     

    debugger;

     

    // var $row = $telerik.$(args.get_row());

     

    // $row.addClass("ruUploading");

     

    // var id = args.get_fileInfo().TempFileLocation;

     

    // var $thumbContainer = $('#thumbNails');

     

    // $thumbContainer.append($telerik.$("</br><img width='180px' />")

     

    // .attr("src", getImageUrl(id)));

     

    // for (var fileindex in sender._uploadedFiles) {

     

    // if (sender._uploadedFiles[fileindex].fileInfo.FileName == args.get_fileName()) {

     

    // isDuplicateFile = true;

     

    // }

     

    // }

     

    $telerik.$(args.get_row()).addClass(

     

    "ruUploading");

    isDuplicateFile =

     

    false;

     

    for (var fileindex in sender._uploadedFiles) {

     

    //if (sender._uploadedFiles[fileindex].fileInfo.FileName == args.get_fileName()) {

     

    if (sender._uploadedFiles[fileindex].fileInfo.FileName == args.get_row().innerText) {

    isDuplicateFile =

     

    true;

    }

    }

    }

     

     

    function getImageUrl(id) {

     

    var url = window.location.href;

     

    var handler = "StreamImage.ashx?TempFileLocation=" + id;

     

    var index = url.lastIndexOf("/");

     

    var completeUrl = url.substring(0, index + 1) + handler;

     

    return completeUrl

    }

     

    function onClientFilesUploaded(sender, args) {

     

    //var $btnSubmit = $("<%=btnSubmit.ClientID %>");

     

    var filesCount = sender.getUploadedFiles().length;

     

    if (filesCount > 0) {

    $(

     

    '#btnSubmit').show();

    $(

     

    '#btnCancel').show();

    }

    }

     

    function DeleteFiles() {

     

    var upload = $find("<%=RadAsyncUpload1.ClientID %>");

     

    var inputFiles = upload.getUploadedFiles();

     

    for (i = 0; i < inputFiles.length; i++)

    upload.deleteFileInputAt(i);

     

    //inputFiles.deleteAllFileInputs();

    upload.updateClientState();

    }

     

    function FilesSelected(sender, args) { // Multiple Files

     

    debugger;

    }

     

    function FileUploadRemoved(sender, args) {

     

    debugger;

     

    if (sender._uploadedFiles.length == 0) {

    $(

     

    '#btnSubmit').hide();

    $(

     

    '#btnCancel').hide();

    }

    }

     

    //]]

     

    </script>

     

    </telerik:RadCodeBlock>

     

    <div>

     

    <telerik:RadAsyncUpload ID="RadAsyncUpload1" runat="server" HttpHandlerUrl="~/CustomHandler.ashx"

     

    TemporaryFolder="TemporaryFolder" OnClientFileSelected="FileSelected" OnClientFilesUploaded="onClientFilesUploaded"

     

    OnClientFileUploadRemoved="FileUploadRemoved" OnClientFilesSelected="FilesSelected"

     

    UploadedFilesRendering="BelowFileInput" OnClientFileUploaded="fileUploaded" MultipleFileSelection="Automatic"

     

    AllowedFileExtensions="jpeg,jpg,gif,png,bmp" Skin="Sunset">

     

    </telerik:RadAsyncUpload>

     

    <telerik:RadProgressArea runat="server" ID="RadProgressArea1">

     

    </telerik:RadProgressArea>

     

    <ul id="myInput" class="ruInputs">

     

    </ul>

     

    <br />

     

    <asp:Button ID="btnSubmit" Text="Submit" runat="server" OnClick="btnSubmit_Click"

     

    Style="display: none" />&nbsp;

     

    <asp:Button ID="btnCancel" runat="server" OnClientClick="DeleteFiles()" Text="Cancel"

     

    OnClick="btnCancel_Click" Style="display: none" />

     

    </div>

     

    </form>

    </

     

     

    body>

    </

     

     

    html>

  11. Dimitar Terziev
    Admin
    Dimitar Terziev avatar
    1084 posts
    Member since:
    Sep 2012

    Posted 13 Jul 2012 Link to this post

    Hi Johnny,

    Please specify the version of the controls that you are using and whether the error is being received in all version of IE or in a specific one. Also record your traffic using Fiddler Cap and provide us the log file so we could inspect it.

    Regards,
    Dimitar Terziev
    the Telerik team

    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.

Back to Top