Customize the Upload Progress Indicators

4 posts, 0 answers
  1. Varun
    Varun avatar
    3 posts
    Member since:
    Apr 2015

    Posted 10 Apr 2015 Link to this post

    Hi,

    Can we customize the Progress Indicators which is shown when uploading the Files to the server? (Red, Green, Yellow one)

    I want it to customize as shown in the attached image.

     

    Thanks,

    Varun

  2. Ivan Zhekov
    Admin
    Ivan Zhekov avatar
    540 posts

    Posted 10 Apr 2015 Link to this post

    Hi, Varun.

    White it's possible to customize the progress indicators, you have to keep the basic layout the same (or deviate from it a bit). That  said, the particular appearance shown in the attached file can not be achieved.

    We could guide you how to customize RadSyncUpload but only for the elements that are available in the control. In this particular case, we can help you customize the progress bar for each control.

    Regards,
    Ivan Zhekov
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Varun
    Varun avatar
    3 posts
    Member since:
    Apr 2015

    Posted 11 Apr 2015 in reply to Ivan Zhekov Link to this post

    Hi Ivan,

    Can you kindly tell me how we can customize the RadSyncUpload?

    Thanks,

    Varun

  5. Ivan Zhekov
    Admin
    Ivan Zhekov avatar
    540 posts

    Posted 16 Apr 2015 Link to this post

    Provided that you want yo customize the progress indicator, the following styles should suffice (assuming you are customizing the default skin)

    .RadUpload_Default .ruUploadProgress .ruFileProgressWrap {
        height: 20px;
        border: 1px solid #e3e3e3 ;
        background: #ffffff;
    }
    .RadUpload_Default .ruUploadProgress .ruFileProgress,
    .RadUpload_Default .ruUploadProgress .ruProgressComplete {
        height: 20px;
        background: #40cc00;
    }



    Regards,
    Ivan Zhekov
    Telerik
     

    See What's Next in App Development. Register for TelerikNEXT.

     
Back to Top