Telerik Forums / UI for ASP.NET AJAX
This is a migrated thread and some comments may be shown as answers.

Width problem of RadAsyncUpload

8 Answers 396 Views
AsyncUpload
This is a migrated thread and some comments may be shown as answers.
Tejas
Top achievements
Rank 1
Tejas asked on 17 Aug 2011, 09:14 PM
resulting-page.jpg
resulting-page2.jpg
Hi,
I have a RadAsyncUpload control on my page in <td> tag of HTML table. Unfortunately, Its width fall outside the HTML table.
I have other elements in the other <td> tag but those elements can not be click as RadAsyncUpload control overlaps the other elements.
How can I control the width of RadAsyncUpload control ?
In the given code demo, If you try clicking Upload button You will still get a file dialogue opened to select file.
Please also note that, the textbox for the description read only. When I replaced RadAsyncUpload control with RadUpload I can enter text in textbox, means It becomes editable.
Here is a HTML:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="TestRadAsyncUpload_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>
    <style type="text/css">
           .ruBrowse
             {
                background-position: 0 -46px !important;
                width: 122px !important;
             }
  
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
    </telerik:RadScriptManager>
    <telerik:RadAjaxPanel ID="ajaxPanel" runat="server" LoadingPanelID="RadAjaxLoadingPanel1">
         <table width="70%" cellpadding="0" cellspacing="0" border="1">
            <tr>
                <td style="width: 30%">
                    Select Files :
                </td>
                <td style="width: 30%; ">
                     <%--<telerik:RadAsyncUpload  ID="uploadRefAndInstrucs" AllowedFileExtensions="doc,docx,xls,xlsx,pdf,zip,rar,tar,gz" runat="server" >
                     </telerik:RadAsyncUpload>--%>
                      
                     At least one file muct be selected<br /> <br />
                    <telerik:RadAsyncUpload  ID="uploadRefAndInstrucs" runat="server" Width="190px" CssClass="ruBrowse" >
                     </telerik:RadAsyncUpload>
                      
                    <%-- <telerik:RadUpload ID="uploadRefAndInstrucs" runat="server" >
                     </telerik:RadUpload>--%>
                      
                </td>
                <td style="width: 40%">
                      
                </td>
                 <td style="width: 30%">
                    Select Files :
                </td>
                <td valign="top" style="width: 30%; ">
                     <%--<telerik:RadAsyncUpload  ID="uploadRefAndInstrucs" AllowedFileExtensions="doc,docx,xls,xlsx,pdf,zip,rar,tar,gz" runat="server" >
                     </telerik:RadAsyncUpload>--%>
                      
                    <telerik:RadAsyncUpload  ID="RadAsyncUpload1" runat="server" Width="190px" CssClass="ruBrowse" >
                     </telerik:RadAsyncUpload>
                     <asp:Button ID="btnUpload" runat="server" CausesValidation="false" Text="Upload" OnClick="btnUploadAnotherLanguage_Click" />      
                    <%-- <telerik:RadUpload ID="uploadRefAndInstrucs" runat="server" >
                     </telerik:RadUpload>--%>
                </td>
                <td style="width: 40%">
                      
                </td>
            </tr>
            <tr>
                <td style="width: 30%">
                    <asp:Label runat="server" ID="lblContentSource" Text="Content Source Language *"
                        Width="100%"></asp:Label>
                </td>
                <td style="width: 30%">
                    <asp:DropDownList runat="server" ID="ddlCotentSourceLanguage" Width="100%">
                        <asp:ListItem Text="-- Select Language --" Value="0"></asp:ListItem>
                        <asp:ListItem Text="Canada" Value="1"></asp:ListItem>
                        <asp:ListItem Text="USA" Value="2"></asp:ListItem>
                        <asp:ListItem Text="China" Value="3"></asp:ListItem>
                    </asp:DropDownList>
                </td>
                <td style="width: 20%">
                      <asp:RequiredFieldValidator ID="ReqContentSourceLanguage" ValidationGroup="UpdateGroup"
                        ToolTip="Content source language is required." runat="server" ControlToValidate="ddlCotentSourceLanguage"
                        InitialValue="0" Text="*" Display="Dynamic" ErrorMessage="Select content source language."></asp:RequiredFieldValidator>
                </td>
                <td colspan="3" style="width: 20%">
                      
                </td>
            </tr>
            <tr>
                 <td align="right">
                            <asp:Label ID="lblDescription" runat="server" Text="Description*"></asp:Label>
                  </td>
                 <td style="width: 25%">
                        <asp:TextBox ID="txtDescription" runat="server"  TextMode="MultiLine" Width="100%"></asp:TextBox>
                </td>
                <td>
                     <asp:RequiredFieldValidator ID="ReqDescription"
                        runat="server" ValidationGroup="UpdateGroup" ControlToValidate="txtDescription"
                        Display="Dynamic" Text="*" ErrorMessage="Enter description."></asp:RequiredFieldValidator>
                </td>
                 <td colspan="3" style="width: 20%">
                      
                </td>
            </tr>
            <tr>
                <td colspan="6">
                     <asp:Button ID="btnUploadAnotherLanguage" runat="server" ValidationGroup="UpdateGroup" Text="Submit" OnClick="btnUploadAnotherLanguage_Click" />      
                </td>
            </tr>
        </table>
    </telerik:RadAjaxPanel>
    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server">
    </telerik:RadAjaxLoadingPanel>
    </form>
</body>
</html>

Thanks

Tejas

8 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 18 Aug 2011, 06:28 AM
Hello Tejas,

Please try overriding the default CSS like below.
CSS:
.RadUpload .ruFileWrap
{
white-space:pre-wrap !important;
}

Thanks,
Shinu.
0
Tejas
Top achievements
Rank 1
answered on 18 Aug 2011, 03:23 PM
Hi Shinu,

Thanks for the reply and I tried your CSS for to RadAsyncUpload control but It does not work.
I'm trying to control the width of RadAsyncUpload control not the RadUpload control.
RadUpload already works Okay. But I want to use RadAsyncUpload control.
You may try the HTML I have provided with RadAsyncUpload control.
Please also observe Description textbox as It should be editable but its uneditable.
Any other clue ?
Thanks

Tejas
0
Peter Filipov
Telerik team
answered on 23 Aug 2011, 08:22 AM
Hi Tejas,

Please clarify which version of our controls and browser you are using. I have tested your code on my side and everything works fine.

All the best,
Peter Filipov
the Telerik team

Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

0
Tejas
Top achievements
Rank 1
answered on 23 Aug 2011, 04:54 PM
Hi,

I'm using version 2010.2.713.35 for telerik controls, IE 9 with version 9.0.8112.16421 and Visual Studio 2008 with framework 3.5.

Thanks

Tejas
0
Accepted
Peter Filipov
Telerik team
answered on 25 Aug 2011, 12:54 PM
Hello Tejas,

I was able to reproduce your CSS issue with the 2010.2.713.35 version. Please add the following CSS to your project:
span.ruFileWrap
{
  position: relative !important;
}

Kind regards,
Peter Filipov
the Telerik team

Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

0
Tejas
Top achievements
Rank 1
answered on 25 Aug 2011, 03:07 PM
Hi,
It worked now !!!.

Thanks

Tejas
0
MTC
Top achievements
Rank 1
answered on 28 Mar 2013, 05:45 AM
Hi,

I am using tekerik RadAsyncUploade Control . It works fine in my Local server(LAN)  but in Production(WAN).
In WAN it always goes to OnClientFileUploadFailed event and shows "Http Error Code is :500" as error message..
Please help me on this..


Posted 2 days ago (permalink)

Hi,

I am using tekerik RadAsyncUploade Control . It works fine in my Local server(LAN)  but in Production(WAN).
In WAN it always goes to OnClientFileUploadFailed event and shows "Http Error Code is :500" as error message..
Please help me on this..Hi,

I am using tekerik RadAsyncUploade Control . It works fine in my Local server(LAN)  but in Production(WAN).
In WAN it always goes to OnClientFileUploadFailed event and shows "Http Error Code is :500" as error message..
Please help me on this..
0
Hristo Valyavicharski
Telerik team
answered on 28 Mar 2013, 03:56 PM
Hi,

I noticed that this forum post is duplicated to http://www.telerik.com/community/forums/aspnet-ajax/async-upload/radasyncupload-issue.aspx. Please submit only one forum post per issue.

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
AsyncUpload
Asked by
Tejas
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
Tejas
Top achievements
Rank 1
Peter Filipov
Telerik team
MTC
Top achievements
Rank 1
Hristo Valyavicharski
Telerik team
Share this question
or