how to add progress bar inside the jquey ignite grid.
Hello Bharathi P,
Thank you for posting in our forums!
You can specify a template that includes HTML for the igGrid's columns. Inside the template, you can create an element that will be used for the progress bar. Then, after the rows are rendered, you can call your code to initialize the progressbar on the template. I recommend doing this in the rowsRendered event.
You can see an example of this in the following jsFiddle:
http://jsfiddle.net/ig_mharrington/vjf7k9sb/
If you have any further questions or concerns with this, please let me know.
Thank your so much. Progress bar in igGrid works fine.
i would like to print the value of progress bar near the progress bar chart and also how to change the color dynamically based on the condition
Please give me the solution if possible.
This only seems to work in Internet Explorer, it doesn't work in Google Chrome
ui.tbody.children().length always returns 0
I am glad to hear you got this working.
In order to display the value in the cell, you will need to modify your template. You can include another element in your template to display the value in. I have modified my jsFiddle and you can see how to achieve this here:
http://jsfiddle.net/ig_mharrington/vjf7k9sb/2/
You can change the color of the progressbar by changing the styling of the elements. You can also see how to achieve this in my sample.
Please be aware that the progressbar is not an Infragistics control. For further information on the progressbar used in my sample, please see jQuery UI's documentation here:
http://api.jqueryui.com/progressbar/ * Please note this site is not owned or maintained by Infragistics.