Make progress bar "clickable"?

7 posts, 1 answers
  1. Frank
    Frank avatar
    22 posts
    Member since:
    Jun 2017

    Posted 11 Dec 2017 Link to this post

    Is it possible to make progress bar "clickable" and it would re-direct to another web page?

     

    Thx.

  2. Answer
    Rumen
    Admin
    Rumen avatar
    13547 posts

    Posted 12 Dec 2017 Link to this post

    Hi,

    RadProgressBar does not offer built-in onclick or onclientclick events since they do not apply to such type of UI component.

    Can you share what your exact scenario and use case is so that we can think of a solution for it?

    Have you thinked of obtaining reference to the rendered markup of the control (see here) and to attach a click handler to the desired HTML element(s)?

    Best regards,
    Rumen
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Frank
    Frank avatar
    22 posts
    Member since:
    Jun 2017

    Posted 12 Dec 2017 in reply to Rumen Link to this post

    I'm trying to use progress bar as a "indicator bar" that shows how many of my "devices" is online.  So for example, if I have 100 devices (devices count is from database) and that 70 is online, it would show 70% and then when user "click" on the progress bar, it would "redirect" them to another .aspx page (which shows the detail information).  That is all.
  4. Frank
    Frank avatar
    22 posts
    Member since:
    Jun 2017

    Posted 12 Dec 2017 in reply to Rumen Link to this post

    Hello Rumen,

    Is is possible you give me a few line of code to do so using a wrapper?

    Thx.

  5. Frank
    Frank avatar
    22 posts
    Member since:
    Jun 2017

    Posted 12 Dec 2017 in reply to Rumen Link to this post

    Nevermind, I think we going to use the pie chart to do this task, so thank you very much for the help.  Although I've posted another problem in the pie chart in the pie chart section of the forum.
  6. Ryan
    Ryan avatar
    4 posts
    Member since:
    Sep 2014

    Posted 26 Feb Link to this post

    I would also like this feature (of being able to detect a click on the progress bar). We display the progress of an asynchronous process in our master page. When the user clicks the progress bar, we'd like to be able to navigate to a page that then shows more details.
  7. Rumen
    Admin
    Rumen avatar
    13547 posts

    Posted 27 Feb Link to this post

    Hi Ryan,

    You can attach the onclick event to the progress bar easily with jQuery:

    <telerik:RadProgressBar RenderMode="Lightweight" ID="rpbFormCompleteness" runat="server" Width="192px" BarType="Chunk" ShowLabel="false" >
       <ClientEvents OnLoad="progressBar_load" />
       <AnimationSettings Duration="500" EnableChunkAnimation="true" />
    </telerik:RadProgressBar>
    <script>
    function progressBar_load(sender, args) {
        progressBar = sender;
        $telerik.$(".rpbChunksWrapper").on("click", function () {
            alert("The chunk item has been clicked and its value is: " + sender.get_value());
            //here you can open a new window and pass the chunk value as a parameter
        })
    }
    </script>


    Best regards,
    Rumen
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top