Pending Review
Last Updated: 19 Dec 2018 19:17 by ADMIN
Srini
Created on: 19 Dec 2018 18:37
Category: UI for ASP.NET AJAX
Type: Feature Request
0
UI for ASP.NET AJAX controls which acts as an order tracker.

Request to addorder tracker component similar to the attached screen shot.

 

Srini

Attached Files:
1 comment
ADMIN
Marin Bratanov
Posted on: 19 Dec 2018 19:15
Hi Srini,

You can do something similar with one of the following with very little extra code:

  • RadProgressBar
  • RadSlider

Example with progress bar:

<style>
    .statusTable {
        width: 300px;
        table-layout: fixed;
    }
 
        .statusTable td {
            width: 25%;
        }
</style>
<telerik:RadProgressBar runat="server" ID="rpb1" ChunksCount="4" BarType="Chunk" Value="1" MaxValue="4" Width="300px" Skin="Telerik"></telerik:RadProgressBar>
<table class="statusTable">
    <tr>
        <td>Picked Up</td>
        <td>In Transit</td>
        <td>Out for Delivery</td>
        <td>Delivered</td>
    </tr>
</table>

Example with slider

<telerik:RadSlider runat="server" ID="rs1" ItemType="Item" Value="2" Width="400px" TrackPosition="TopLeft" ShowDecreaseHandle="false" ShowIncreaseHandle="false" Skin="Telerik" Height="100px" Enabled="false">
    <Items>
        <telerik:RadSliderItem Text="Picked Up" />
        <telerik:RadSliderItem Text="In Transit" />
        <telerik:RadSliderItem Text="Out for Delivery" />
        <telerik:RadSliderItem Text="Delivered" />
    </Items>
</telerik:RadSlider>

Where in both cases I chose the Telerik skin because of its green highlights.


Regards,
Marin Bratanov
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.