This is a migrated thread and some comments may be shown as answers.

RadUpload looks strange in IE 8

46 Answers 380 Views
Upload (Obsolete)
This is a migrated thread and some comments may be shown as answers.
Kevin Donahue
Top achievements
Rank 1
Kevin Donahue asked on 27 Sep 2011, 05:50 AM

I just updated to the latest telerik ajax controls (2011.2 915) and now the RadUpload control looks very strange in IE 8.  No matter what skin I put on it, it just looks like a gray box with a top and right border and no browse button.

In Firefox it looks correct.


Any ideas?

46 Answers, 1 is accepted

Sort by
0
Kevin Donahue
Top achievements
Rank 1
answered on 27 Sep 2011, 06:34 AM
Here is my page:

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm2.aspx.vb" Inherits="WebForm2" %>
<!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 runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">

    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        <Scripts>
            <asp:ScriptReference Assembly="Telerik.Web.UI"
                Name="Telerik.Web.UI.Common.Core.js">
            </asp:ScriptReference>
            <asp:ScriptReference Assembly="Telerik.Web.UI"
                Name="Telerik.Web.UI.Common.jQuery.js">
            </asp:ScriptReference>
            <asp:ScriptReference Assembly="Telerik.Web.UI"
                Name="Telerik.Web.UI.Common.jQueryInclude.js">
            </asp:ScriptReference>
        </Scripts>
    </telerik:RadScriptManager>

    <telerik:RadUpload ID="RadUpload1" Runat="server" InputSize="50"
                        ControlObjectsVisibility="None" MaxFileInputsCount="1" OverwriteExistingFiles="True"
                        ReadOnlyFileInputs="True" Skin="Web20">
    </telerik:RadUpload>

    <telerik:RadAjaxManager runat="server">
    </telerik:RadAjaxManager>

    </form>
</body>
</html>
0
Kevin Donahue
Top achievements
Rank 1
answered on 27 Sep 2011, 06:35 AM
I was wrong, Firefox is playing up as well.  Works in simple scenario (like my test page) but not when I have it in a table.  It just doesn't appear.
0
Dimitar Terziev
Telerik team
answered on 29 Sep 2011, 03:37 PM
Hi Kevin,

I've made a sample page with the RadUpload situated in a table trying to reproduce the issue, but to no avail.

Please open a support ticket and provide a runnable sample page with the issue being reproduced so we could examine it locally.

All the best,
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
0
Dirk
Top achievements
Rank 1
answered on 04 Oct 2011, 02:14 PM
I have the exact same problem as the OP. Works in IE6 and firefox though.
0
Dimitar Terziev
Telerik team
answered on 06 Oct 2011, 11:09 AM
Hi Dirk,

Please try to provide a screenshot showing the problem and the implementation that you are using so I could test it locally.

All the best,
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
0
Kevin Donahue
Top achievements
Rank 1
answered on 07 Oct 2011, 12:36 AM
Here is a screenshot on my machine that is having the problem with IE 8.  The strange thing is, I tried it on another machine and it works fine in IE 8.

Here is the page:  Notice I added BackColor="gray" and that color shows up where I would expect the browse button to be.  It still works as long as I click on the text box input and that brings up the file selection dialog.

<%@ Page Language="vb" AutoEventWireup="false" CodeBehind="WebForm4.aspx.vb" Inherits="Temp.WebForm4" %>

 <!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 runat="server">
<
title></title>
</head>
<body>
<
form id="form1" runat="server">
<
telerik:RadScriptManager ID="RadSM1" runat="server">
</
telerik:RadScriptManager>
<
telerik:RadUpload ID="RadUpload1" runat="server" InputSize="50" ControlObjectsVisibility="None" MaxFileInputsCount="1" OverwriteExistingFiles="True" ReadOnlyFileInputs="True" BackColor="gray" TargetFolder="~/Images/">
</
telerik:RadUpload>
<
telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" EnableAJAX="true" EnableViewState="False"></telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" Runat="server" Skin="Default" Transparency="0" EnableViewState="False">
</
telerik:RadAjaxLoadingPanel>
</
form>
</body>
</html>

 

0
Dimitar Terziev
Telerik team
answered on 11 Oct 2011, 12:06 PM
Hello Kevin,

I've tested the sample mark-up provided with the latest official version of the controls and the upload is shown properly in IE8.

Since you have mentioned that this only happens on your machine, please check whether you have some specific add-on on the browser which might be causing this strange behavior or some custom settings.

All the best,
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
0
Kevin Donahue
Top achievements
Rank 1
answered on 11 Oct 2011, 11:43 PM
It has to be something that has changed in the latest version of the Telerik control.  When I reference an older Telerik.Web.UI.dll the RadUpload control displays properly with the browse button (see attached image).  However, when I use the latest version (2011_2_915) the control gets rendered as you saw in my previous post.  The Telerik.Web.UI version that does work is Telerik.Web.UI_2010_2_826.  I also think it was working in version 2011_2_712, but I can't verify that as that version has been replace by 2011_2_915 on my development machine.

I don't have any toolbars installed in IE 8.

Can you think of any settings I should be looking at in IE?
0
Genady Sergeev
Telerik team
answered on 14 Oct 2011, 11:59 AM
Hello Kevin Donahue,

We are still unable to reproduce the problem, on our side the upload looks pretty fine. Could you please make sure that your IE is configured to display JavaScript errors:

1) Go to Tools
2) Internet Options
3) Advanced
4) Make sure that there is no thick on "Disable JavaScript debugging"

If there are no JavaScript errors, however, the upload still renders the same way please install Internet Explorer developer toolbar and check in what mode is your IE running. I am attaching a screenshot showing where you should look.


All the best,
Genady Sergeev
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
0
Genady Sergeev
Telerik team
answered on 14 Oct 2011, 04:48 PM
Hi Kevin Donahue,

Please try removing the InputSize setting from your upload declaration. Does the problem persist? We believe that changing the input size triggers such issue in some environments (always with IE8).

All the best,
Genady Sergeev
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
0
Alain
Top achievements
Rank 1
answered on 21 Oct 2011, 10:56 PM
I have a similar issue. With the SP1, the browse button disappear. I'm no longer see any selection but it is there because the upload works.

I will dig a little bit in the problem next monday. If you find something let me know, I will follow this thread and keep you informed of what I found.



I'm starting to running out of time right now and I need to deliver something....
0
Kevin Donahue
Top achievements
Rank 1
answered on 23 Oct 2011, 11:29 PM
Sorry, I've been busy on other things, so its taken me a while to get back to this.

Ok, so I got rid of the InputSize and, yes, the browse button is now there.  However, my form looks funny if that input is not sized properly.  Is there a work around for this?  Or is this something that will be addressed in a future release?

I have no javascript errors (my "Disable JavaScript debugging" setting is unticked)

And after downloading the IE developer toolbar, it says my Browser Mode is IE8 and my Document Mode is IE8 Standards.

Anything else you want me to check to help solve this issue?

BTW, Genady, you attached the wrong screen shot.
0
Alain
Top achievements
Rank 1
answered on 24 Oct 2011, 03:02 PM
Interresting! When the InputSize is more than 20 it overlaps the browse button. There is something wrong with the template. How to customize or modify the RadUpload template? This is what I'm looking for and the only workaround I can see.

[...]

Definitly, I can't find a workable solution. I reduced de InputSize from 55 to 20 to temporarily fix the problem. The control with is wide enough but the the input size is too small. I hope that this problem will be fixed in the next release.

<telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" CdnSettings-TelerikCdn="Disabled"/>
 
 <telerik:RadScriptManager ID="RadScriptManager1" runat="server" EnableCdn="false" CdnSettings-TelerikCdn="Disabled">
        <Scripts>
          <%--Needed for JavaScript IntelliSense in VS2010--%>
          <%--For VS2008 replace RadScriptManager with ScriptManager--%>
          <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
          <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
          <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
        </Scripts>     
 </telerik:RadScriptManager>
 
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
      </telerik:RadAjaxManager>
 
<telerik:RadUpload ID="RadUpload1" runat="server" InputSize="20" InitialFileInputsCount="1"
                   Width="450px" Skin="Web20" OnValidatingFile="RadUpload1_ValidatingFile"
                   ControlObjectsVisibility="RemoveButtons, AddButton">
     
  <Localization   Select="<%$ Resources:RadUpload, Select %>"
                  Remove="<%$ Resources:RadUpload, Remove %>"
                  Add="<%$ Resources:RadUpload, Add %>"
                  Clear="<%$ Resources:RadUpload, Clear %>"
                  Delete="<%$ Resources:RadUpload, Delete %>" />
 
</telerik:RadUpload>
0
Kevin Donahue
Top achievements
Rank 1
answered on 24 Oct 2011, 11:59 PM
Hi Alain,

You might be able to adjust it using CSS.  You can override the Telerik CSS classes, make sure you use !important if you want to make sure your style gets applied.

I tried it out in other browsers on my machine.  Firefox seems ok, not sure why I thought that wasn't working before.  Strange that Opera resizes differently to the others.  See my image attached.
0
Genady Sergeev
Telerik team
answered on 25 Oct 2011, 03:33 PM
Hi guys,

I believe we are facing a weird filter bug in IE8. The Upload uses an opacity filter to overlay the default file input's Select button. This filter is implemented as an ActiveX control in IE versions 8 and below. As such, it is subject to security settings and can be accidentally disabled. Apart from this, it seems that the filter is failing in if there is Zoom applied to a page. Do you guys use pages that have zoom?

I've that following suggestion, could you try using this CSS on pages with RadUpload:

<style type="text/css">
        .ruFileInput
        {
            zoom: 1.03 !important;
        }
    </style>

Does this change anything?

All the best,
Genady Sergeev
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
0
Alain
Top achievements
Rank 1
answered on 25 Oct 2011, 06:52 PM
Hi Genady,

I try your suggestion and now I can see the Browse button in IE 8. However, the button is not clickable, the opacity filter for the browse (select) button still overlap the the RadInput field as you can see below.



With firefox, that works correctly. With IE, the page zoom option seems to change nothing. I let it to 100%.

Is that help? Do you have another suggestion?

Thanks
Alain
0
Kevin Donahue
Top achievements
Rank 1
answered on 26 Oct 2011, 12:01 AM

Same thing here.  Clicking on the Browse button does nothing.  I have to click on the smaller top-most grey input for the file dialog to come up.

I don't do anything with zoom on my page.

0
Dirk
Top achievements
Rank 1
answered on 26 Oct 2011, 08:19 PM
Hello,

I would like to try the mentioned css fixes but the problem is the upload control which shows the problem for me is the one used by the radeditor. it is shown in a radWindow dialog which uses an iframe, thus it does not see the css fix.
How can I apply these fixes for controls which are not directly controlled by me and loaded in a radwindow?
0
Genady Sergeev
Telerik team
answered on 27 Oct 2011, 08:26 AM
Hi,

Before trying the CSS classes first try this:

Set the following option to "Enable" in Internet Explorer: "Internet Options -> Security -> Internet (or Local intranet) -> Custom Level -> Binary and script behaviors"

Does the issue persist?

As for the css classes, simply place

<style type="text/css">
        .ruFileInput
        {
            zoom: 1.03 !important;
        }
    </style>

On the page that is opened inside the RadWindow or, in the case with Editor, on the page that contains the editor.

Greetings,
Genady Sergeev
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
0
Alain
Top achievements
Rank 1
answered on 27 Oct 2011, 03:34 PM
Hi Genady,

In my case the "Binary and script behaviors" option was and it is still enable for the two levels : Internet and Local Intranet.

The control is working but the Input size is limited to 20 characters. The width of 450px is wide enough and when I try to increase the Input Size, the Browse (select) button disappear and a kind of filter overlap the Input area. The control is still working but the text in the Input area is hidden by this kind of filter. The CSS trick partially fixed the problem by displaying the Browse button but the filter stay there and the button is still not clickable.

This control was working fine in the previous release and my QA is not happy with this small RadInput. Is it possible to just restore the previous RadUpload control?

Alain
0
Kevin Donahue
Top achievements
Rank 1
answered on 28 Oct 2011, 06:21 AM
Mine was already enabled as well for internet, intranet and trusted sites.
0
Genady Sergeev
Telerik team
answered on 01 Nov 2011, 04:55 PM
Hi all,

Have you tried applying zoom:1 to the .ruFileInput css class?

The reason it was working in the previous version and is not working now, is that we have changed the way the invisible input is positioned under the fake input in order to solve annoying bug in IE6/7/8 where the select button was not clickable. However, as it seems, we have introduced another bug, again in IE/6/7/8, where the opacity filter is not applied to the real input in some (yet unknown) cases.

We have did some changes to the positioning styling for the Q3 beta release. Have any of you guys tried out the beta yet?

Regards,
Genady Sergeev
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
0
Alain
Top achievements
Rank 1
answered on 01 Nov 2011, 07:30 PM
Hi Genady,

I played a little bit with the zoom factor to the .ruFileInput css class.

With Zoom factor < 1.02 => No Browse Button available.
With Zoom factor >= 1.03 => The browse button appears but is not clickable / The filter over the input area start stretching.
With Zoom factor = 1.05 => The filter almost disappears and the input area became an standard input text / The browse button is still not clickable ( see picture).


With Zoom factor > 1.06 => The filter totally disappear and the input area is like a standard input text / The browse button is still not clickable / The selection is impossible.

Then, I installed the the Q3 release, I modified my application because only the default skins seems available, and I have the same problem.

What can I do?

Alain
0
Genady Sergeev
Telerik team
answered on 08 Nov 2011, 09:37 AM
Hi,

We did slight changes to the RadUpload css for the upcoming Q3 release. More specific, it is now possible to fine tune the file input size. We discovered that decreasing the hidden input size fixes the opacity filter bug. Before the Q3 release, the following style was set to the hidden file input:

.RadUpload input.ruFileInput
{
    font: 200px monospace !important;
}

As you can see, it is set with !important, so that it is not possible to override it. Now we have removed the important declaration and it is possible to decrease the size and override the default style. Here is how:

div.RadUpload input.ruFileInput
{
     font: 50px monospace
}

I hope that this helps.


Kind regards,
Genady Sergeev
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
0
Genady Sergeev
Telerik team
answered on 08 Nov 2011, 10:20 AM
Hi guys,

We have developed a test whether IE refuses to make file input elements transparent. You can find it here:

http://jsfiddle.net/VwP5f/




All the best,
Genady Sergeev
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
0
Alain
Top achievements
Rank 1
answered on 08 Nov 2011, 10:47 PM
Good News!

How many time left before the Q3 release? I guess this is for the end of November.

In mid time, can we do something or we just have to be patient?

Thanks
Alain
0
Kevin Donahue
Top achievements
Rank 1
answered on 09 Nov 2011, 07:02 AM
Is this what that test page should look like?
0
Genady Sergeev
Telerik team
answered on 14 Nov 2011, 05:59 PM
Hi Kevin,

No, it seems that your IE fails to filter the hidden input. Could you please try decreasing the font: 500px monospace. You can try doing with a step of 100px until your reach 100px and then with a step of 20px. Does at some point the problem vanish? Thank you for your cooperation!

Alain, the Q3 release is due to few days, it should be released by the end of this week. Until it is released, you can try setting the EnableFileInputSkinning property to false.


All the best,
Genady Sergeev
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
0
Slava
Top achievements
Rank 1
answered on 21 Nov 2011, 06:36 PM
Genady, I've removed the "InputSize" setting but the "Select/Browse" button still is not showing on the page, in IE8, works fine in IE9 and FireFox. What am I missing? I thought as long as I wouldn't use "InputSize" everything should work properly with the new telerik version.

<

 

 

telerik:RadUpload ID="RadUpload1" runat="server" ControlObjectsVisibility="None" Skin="Default" MaxFileInputsCount="1" TabIndex="8">

 

 

 

<Localization Select="Browse" />

 

 

 

</telerik:RadUpload>

 

0
Alain
Top achievements
Rank 1
answered on 21 Nov 2011, 07:11 PM
Last Thursday, I upgraded the AJAX components and added the new theme style in reference and everything work fine with IE8, IE9 and Firefox.

Thank you very much.

<telerik:RadUpload ID="RadUpload1" runat="server" Width="450px" InputSize="55"  InitialFileInputsCount="1"
                    OnValidatingFile="RadUpload1_ValidatingFile"
                   ControlObjectsVisibility="RemoveButtons, AddButton">
     
  <Localization   Select="<%$ Resources:RadUpload, Select %>"
                  Remove="<%$ Resources:RadUpload, Remove %>"
                  Add="<%$ Resources:RadUpload, Add %>"
                  Clear="<%$ Resources:RadUpload, Clear %>"
                  Delete="<%$ Resources:RadUpload, Delete %>" />
 
</telerik:RadUpload>

However, I don't understand why its not working for Slava. I've removed the 'Width' and 'InputSize' and I also set the 'ControlObjectsVisibility' to None and everything work as expected.

Slava, try to set the InitialFileInputsCount="1". This is the only thing I can see. I'm also not using the Skin parameter because it is set in the Web.Config in my application.

Alain
0
Slava
Top achievements
Rank 1
answered on 21 Nov 2011, 07:44 PM
Adding InitialFileInputsCount="1" didn't help. I've had that exact code before we've upgraded to the next telerik's version, and everything worked fine, even with "InputSize", so I don't think the Skin setting would be a problem but I've removed it, just in case, and it still not showing the "Select" button.
0
Genady Sergeev
Telerik team
answered on 25 Nov 2011, 01:34 PM
Hi Slava,

It seems that there is something specific regarding your environment that we are not aware of. I have the following suggestion, could you please place this style on the page and let us know how it is going. Is the problem resolved?

.ruFileInput
       {
           font: 11px/10px "Segoe UI",Arial,sans-serif !important;
       }


Greetings,
Genady Sergeev
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
0
Kræn Munck
Top achievements
Rank 1
answered on 19 Dec 2011, 02:43 PM
Hi,

You can also try downgrading to 2011.1.621.40 .. we're seeing some strange control hovering, but atleast the select button is there :)

Latest versions are broken! Telerik demos will verify that!

See attached image..
0
Genady Sergeev
Telerik team
answered on 21 Dec 2011, 10:10 AM
Hello Kræn Munck,

Have you tried the suggestion from my previous replay?

Kind regards,
Genady Sergeev
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
0
Greg
Top achievements
Rank 1
answered on 18 Jan 2012, 08:06 PM
I ran into this same problem and I have the solution!!! The problem is in the RadUpload InputSize property. If InputSize is <= 57 it works correctly. If InputSize is >= 58 it does not render properly. Note that I'm using the Office2007 skin. Here is my test page...

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Default" %>
  
<!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>
    <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        <Scripts>
            <%--Needed for JavaScript IntelliSense in VS2010--%>
            <%--For VS2008 replace RadScriptManager with ScriptManager--%>
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
        </Scripts>
    </telerik:RadScriptManager>
    <script type="text/javascript">
        //Put your JavaScript code here.
    </script>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    </telerik:RadAjaxManager>
    <div>
  
        <telerik:RadUpload ID="RadUpload1" Runat="server" InputSize="57">
        </telerik:RadUpload>
  
        <telerik:RadUpload ID="RadUpload2" Runat="server" InputSize="58">
        </telerik:RadUpload>
    </div>
    </form>
</body>
</html>
0
Genady Sergeev
Telerik team
answered on 25 Jan 2012, 08:20 AM
Hello Kevin,

Thanks for pointing this to us. I've forwarded to our QA, however, at least on my machine I was not able to reproduce it. It seems that there it is a combination of IE security settings and configuration of RadUpload that is triggering the problem.

All the best,
Genady Sergeev
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
0
Tonino
Top achievements
Rank 1
answered on 24 Feb 2012, 08:56 AM
Hello!

I've a similar problem here with running IE in compatibility mode set in web.config:
<httpProtocol>
   <customHeaders>
      <add name="X-UA-Compatible" value="IE=EmulateIE7" />
   </customHeaders>
</httpProtocol>


The markup looks like this:
<div>
   <telerik:RadUpload ID="upload" runat="server" Skin="Default" MaxFileInputsCount="1"
      ControlObjectsVisibility="None" EnableFileInputSkinning="false"
      OnClientFileSelected="ClientFileSelected" ReadOnlyFileInputs="true" />
   <telerik:RadUpload ID="RadUpload1" runat="server" InputSize="57">
   </telerik:RadUpload>
   <telerik:RadUpload ID="RadUpload2" runat="server" InputSize="58">
   </telerik:RadUpload>
</div>

See the attached file for how the output looks! The 'browse'-button is missing. The second and third RadUpload control are copied from Greg's post above and look ok, but the one I need doesn't look ok. Version of the telerik controls I'm using: 2011.3.1305.40


Update:
Found the culpit! Removing EnableFileInputSkinning="false" shows the 'browse'-button again!



Regards,
Tonino.
0
Genady Sergeev
Telerik team
answered on 29 Feb 2012, 09:32 AM
Hello Tonino,

We are aware of that problem and have already resolved it. The fix will be available with the next service pack.

Regards,
Genady Sergeev
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.
0
Infraestrutura
Top achievements
Rank 1
answered on 09 Mar 2012, 05:27 PM
Genady, when the fix will be available ? Have any date ?

I have the same issue.

Thanks
0
Genady Sergeev
Telerik team
answered on 14 Mar 2012, 09:38 AM
Hello Nuno,

The service pack is scheduled for the mid of April. Is this an urgent problem for you? If so, you can utilize the latest internal build, which contains the fix as well. You can find more information regarding the latest internal build here.

Kind regards,
Genady Sergeev
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.
0
Shoaib
Top achievements
Rank 1
answered on 05 Mar 2013, 05:26 AM
.showme

 {visibility: visible;}

.hideme

 

 

 {visibility: hidden;}

 

 

 
<

telerik:RadAsyncUpload runat="server" ID="anex5" AllowedFileExtensions="jpg,jpeg,png,gif,doc,docx,xls,xlsx,zip"

MaxFileSize="5242880" InputSize="2" Width="220" InitialFileInputsCount="1" Skin="Metro"

OverwriteExistingFiles="false" TargetFolder="~/Source/Doc/" TargetPhysicalFolder="~/Source/Doc/"

AutoAddFileInputs="false" OnFileUploaded="anex5Edit_FileUploaded" OnClientFileUploading="anex5_OnClientFileUploading"

OnClientFileUploaded="anex5_OnClientFileUploaded" OnClientValidationFailed="anex5_validationFailed"

OnClientFileSelected="anex5_OnClientFileSelected" OnClientFileUploadRemoving="anex5_OnClientFileUploadRemoving"

OnClienFileUploadRemoved="anex5_OnClienFileUploadRemoved" ClientIDMode="Static"

CssClass="hideme" >

</telerik:RadAsyncUpload>

 function test5() {
                //$telerik.$(".anex5").css("showme");
                document.getElementById('anex5').className = "showme";
                return false;
            }

After Click on image button , I just set the class from javascript. In IE9 strange behaviour. both files are attached.it is very urgent please help me in this regards.

0
Plamen
Telerik team
answered on 08 Mar 2013, 08:56 AM
Hello,

 
You can use the client object of RadAsyncUplaod instead of using this css styles as in the code below:

  var asyncUpload = $find("<%= anex5.ClientID %>");
                asyncUpload.set_visible(false);
//  asyncUpload.set_visible(true);

Hope this will be helpful.


Kind regards,
Plamen
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.
0
Shoaib
Top achievements
Rank 1
answered on 11 Mar 2013, 06:28 AM

Hi Plamen ,

First of all thanks for your reply , its working fine , but when I am trying to using it in NestedViewTemplate Of Rad Grid view , so I am unable to find this object.when I try to find this object , so I msg raised unable to find object.Below is my markup where I am again facing same issue again :(


<

telerik:RadGrid ID="grvProjectTelerik" runat="server" AllowPaging="True" Style="font-family: serif"

 Skin="Windows7" OnItemCommand="grvProjectTelerik_ItemCommand" PageSize="30" OnItemCreated="grvProjectTelerik_ItemCreated">

 

<MasterTableView AutoGenerateColumns="False" HierarchyLoadMode="ServerOnDemand" DataKeyNames="project_id,project_description,title,statusId,anx1">

 

<Columns>

<telerik:GridBoundColumn DataField="title" HeaderText="Capex Title" UniqueName="ProjectTitle"

FilterControlAltText="Filter 1 column" ItemStyle-HorizontalAlign="Left" DataType="System.String">

 </telerik:GridBoundColumn>

</Columns>

<NestedViewSettings DataSourceID="SqlDataSource2">

<ParentTableRelation>

<telerik:GridRelationFields DetailKeyField="project_id" MasterKeyField="project_id" />

</ParentTableRelation>

 </NestedViewSettings>

<NestedViewTemplate>

<asp:Panel ID="NestedViewPanel" runat="server" CssClass="viewWrap" ScrollBars="Auto">

 <div class="contactWrap">

<telerik:RadAsyncUpload runat="server" ID="anex1Edit" AllowedFileExtensions="jpg,jpeg,png,gif,doc,docx,xls,xlsx,zip,bmp"

MaxFileSize="5242880" InputSize="2" Width="220" InitialFileInputsCount="1" Skin="Metro"

 OverwriteExistingFiles="false" TargetFolder="~/Source/Doc/" TargetPhysicalFolder="~/Source/Doc/"

AutoAddFileInputs="false" OnFileUploaded="anex1Edit_FileUploaded" OnClientFileUploading="anex1Edit_OnClientFileUploading"

OnClientFileUploaded="anex1Edit_OnClientFileUploaded" OnClientValidationFailed="anex1Edit_validationFailed"

OnClientFileSelected="anex1Edit_OnClientFileSelected" OnClientFileUploadRemoving="anex1Edit_OnClientFileUploadRemoving"

 OnClienFileUploadRemoved="anex1Edit_OnClienFileUploadRemoved" ClientIDMode="Static">

 </telerik:RadAsyncUpload>

</div>

</asp:Panel>

 </NestedViewTemplate>

<EditFormSettings>

 <EditColumn FilterControlAltText="Filter EditCommandColumn column">

</EditColumn>

 </EditFormSettings>

</MasterTableView>

 <ItemStyle HorizontalAlign="Left" />

<PagerStyle HorizontalAlign="Left"></PagerStyle>

 <ExportSettings FileName="Shoaib">

<Pdf Author="Shoaib" Creator="Shoaib" PageTitle="Shoaib's RadGrid" Subject="Shoaib"

Title="Shoaib" />

</ExportSettings>

 <ClientSettings>

 <Selecting CellSelectionMode="None"></Selecting>

 </ClientSettings>

 <PagerStyle Mode="NumericPages"></PagerStyle>

 </telerik:RadGrid>

<asp:SqlDataSource ID="SqlDataSource2" ConnectionString="<%$ ConnectionStrings:dbCon %>"

SelectCommand="Select * from testing where ttpid =@project_Id" runat="server">

<SelectParameters>

<asp:Parameter Name="project_id" />

 </SelectParameters>

</asp:SqlDataSource>



 

0
Hristo Valyavicharski
Telerik team
answered on 14 Mar 2013, 07:19 AM
Hi Shoaib,

you can use jQuery to select RadAsyncUpload by class name:
var asyncUploadId =  $('.RadAsyncUpload.RadUpload.RadUpload_Windows7').attr('id');
 
var asyncUpload = $find(asyncUploadId);
asyncUpload.set_visible(false);
//  asyncUpload.set_visible(true);


All the best,
Hristo Valyavicharski
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.
0
Shoaib
Top achievements
Rank 1
answered on 15 Mar 2013, 02:22 PM
Still null return ?????????? , Waiting for your positive response. I have radgrid inside rad grid I have a NestedViewTemplated, In a nestedviewTemplate I have a  panel  RadAsyncUpload.

var asyncUploadId = $('.RadAsyncUpload.RadUpload.anex1Edit').attr('id');
var asyncUpload = $find(asyncUploadId); // null returns here :/
//asyncUpload.set_visible(false);




Regards.
0
Hristo Valyavicharski
Telerik team
answered on 20 Mar 2013, 01:51 PM
Hi Shoaib,

Probably you have multiple RadAsyncUploads in the RadGrid. Use Firebug or Chrome Developer tools to see what is the class name that RadAsyncUpload has. Note that it will be the same for all RadAsyncUploads.

As far as from your code snippet you are using Windows7 skin for the Grid and Metro skin for RadAsyncUpload. Then upload control should have this class name:
class="RadAsyncUpload RadUpload RadUpload_Metro" similar to this screenshot.

Use jQuery to get collection with all uploads in the grid and finally get id of the desired control:
//get collection with all RadAsyncUpload controls that has Metro skin
var uploads =  $('.RadAsyncUpload.RadUpload.RadUpload_Metro');
 
//Get id if you have only one RadAsyncUpload in the grid
var asyncUpload =$('.RadAsyncUpload.RadUpload.RadUpload_Metro').attr('id');
 
//Get id if you have multiple RadAsyncUpload controls in the grid
var asyncUpload1 = uploads[0].id;
var asyncUpload2 = uploads[1].id;


Kind regards,
Hristo Valyavicharski
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.
Tags
Upload (Obsolete)
Asked by
Kevin Donahue
Top achievements
Rank 1
Answers by
Kevin Donahue
Top achievements
Rank 1
Dimitar Terziev
Telerik team
Dirk
Top achievements
Rank 1
Genady Sergeev
Telerik team
Alain
Top achievements
Rank 1
Slava
Top achievements
Rank 1
Kræn Munck
Top achievements
Rank 1
Greg
Top achievements
Rank 1
Tonino
Top achievements
Rank 1
Infraestrutura
Top achievements
Rank 1
Shoaib
Top achievements
Rank 1
Plamen
Telerik team
Hristo Valyavicharski
Telerik team
Share this question
or