Change backcolor of file TextBox

Thread is closed for posting
8 posts, 0 answers
  1. Bieters Bieters
    Bieters Bieters avatar
    10 posts
    Member since:
    May 2010

    Posted 22 Apr 2011 Link to this post

    Hello,

    I want to change the color of the file TextBox server side.
    From the helpfiles I know that the appearance of the text box is set with the .ruFakeInput class

    When I put this piece of code in my aspx page it overloads the default values of the .ruFakeInput and the TextBox becomes red on page load.

    <style type="text/css"> 
    div.RadUpload_Skin1 .ruFakeInput
        {
            border-color:#93070a;
            /* background-image:url('Input/sprite.gif') 100% -148px no-repeat; */
            color:#ff9000;
            background-color: #9C362A;
            color: #FFF;
        }
    </style>

    But this puts it directly on page load in red. I want to put it red after a condition is true after a postback via a button (for example no file selected).

    How can this be done? It seems that the textbox itself, inside the RadUpload, can't be accessed server side, only the RadUpload control?

    Thanks.
  2. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 22 Apr 2011 Link to this post

    Hi Bieters Bieters,

    You can apply the following style to the RadUpload control from code behind like this:

    <style type="text/css">
          div.Upload .ruFakeInput
        {
            border-color:#93070a;
            /* background-image:url('Input/sprite.gif') 100% -148px no-repeat; */
            color:#ff9000;
            background-color: #9C362A;
            color: #FFF;
        }
        </style>

    aspx:
    <telerik:RadUpload ID="RadUpload1" runat="server" >
          </telerik:RadUpload>

    server-side code:
    RadUpload1.CssClass = "Upload";

    Regards,
    Kate
    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. UI for ASP.NET Ajax is Ready for VS 2017
  4. Bieters Bieters
    Bieters Bieters avatar
    10 posts
    Member since:
    May 2010

    Posted 22 Apr 2011 Link to this post

    Works great.
    Thanks!
  5. shinu rag
    shinu rag avatar
    48 posts
    Member since:
    Feb 2010

    Posted 16 Jan 2012 Link to this post

    hi kate,
    how to do this using javascript?
  6. Bieters Bieters
    Bieters Bieters avatar
    10 posts
    Member since:
    May 2010

    Posted 16 Jan 2012 Link to this post

    You can use addClass (jquery)
    http://api.jquery.com/addClass/
  7. shinu rag
    shinu rag avatar
    48 posts
    Member since:
    Feb 2010

    Posted 16 Jan 2012 Link to this post

    hi Bieters,
    thanks for your reply :)

    i tried it, like this:

    <telerik:RadAsyncUpload ID="UL_EduFile " runat="server" 
                    AutoAddFileInputs="False" TemporaryFolder="~/Temp/PatEducation" Width="210px">
                </telerik:RadAsyncUpload>

    <style type="text/css">
        
        div.Upload .ruFakeInput
        {
            border-color: Red;
            border-style: ridge;
            border-width: 2px;
            
        }
        </style>

    var UL_EduFile = document.getElementById('<%= UL_EduFile .ClientID %>');

    if (UL_EduFile.value == '')
    {
                   UL_EduFile.addClass("Upload");
       b = false;
    }

    but i lost the default cssclass of the upload control...

    here i need to highlight the input textbox when user not select any file for upload...


    thanks
    shinurag
  8. Bieters Bieters
    Bieters Bieters avatar
    10 posts
    Member since:
    May 2010

    Posted 16 Jan 2012 Link to this post

    Hi,
    what exactly do you mean that you lost the default css class?

    This does remove the class again:
    UL_EduFile.removeClass("Upload");
  9. shinu rag
    shinu rag avatar
    48 posts
    Member since:
    Feb 2010

    Posted 16 Jan 2012 Link to this post

    hi..
    yes when i coding this UL_EduFile.addClass("Upload");

    i lost the default css class..
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017