Excel Like Add Rows Above, Below at client side in Infragistics UltraWebGrid with the help of UltraWebMenu
Posted by senthilsweb on December 15, 2007
Infragistics Ultrawebgrid is a popular ASP.NET RAD web grid control which supports creating hierarchical datagrid in a breeze. Its CSOM [Client side Object Model] exposes many client side events which greatly helps to meet any kind of challenging requirements and simply reduces development time. My requirement is to Add Grid Rows Just above [or] below the selected Active row and all the operations should be at client side, just like excel. Unfortunately Infragistics Ultrawebgrid doesn’t support this kind of requirement out of the box, It supports adding rows at Top [or] Bottom of the grid not above [or] below any selected active rows [This can be done at server side by attaching UltrawebNavbar control to Ultrawebgrid]
I searched their forum post and googling to achieve this in client side but no luck. I managed to achieve the desired result [XLGrid Sample 1] by manipulating their client side methods, for javascript source code please look view source of the demo page. The demo [ XLGrid Sample 1] is a flat grid [one level] but my requirement is adding rows dynamically for hierarchical grid at all levels [3 level]. I have done it for my project requirement but yet to create a sample to post it here.
How I did:
1. Infragistics supports adding rows on Top / bottom of the grid through javascript igtbl_addNew. I utilized igtbl_addNew to add a new row at the bottom of the grid and simultaneously stored the desired index location where the new row should be added in a page level javascript variable
2. Infragistics also exposes two other methods remove and insert at particular index location. So i utilized those methods i.e. I removed the just added row [bottom most row] using remove method and then reinsert that row in the desired location using insert method.
Internally Infragistics uses remove and insert methods for client side sorting.
Note:
This post is not about the features of Infragistics ultrawebgird, to learn about the usage and features please refer their web site.





charles said
Hi Senthil,
Can you post the sample demo and code for “Excel Like Add Rows Above, Below at client side in Infragistics UltraWebGrid with the help of UltraWebMenu”
Urgent………
senthilsweb said
Hi charles,
I have updated the post with source code and also made the demo running
regards,
senthilnathan
prabhu said
can u tell me how to make a parent column width synchronised if i use mouse to drag the child column width in heirarchial webgrid
when i drag the child columns to increase/decrease the width of it,i need the parent columns also to get reflected to make the grid look better
czac said
Can this be applied to Hierarchical UltraWegGrid? If so can you give an example?
Chad said
I’ve added this to a project of mine.
The first band of the grid seems to work fine. The issue is with my second band of my hierarchical grid…no matter which selection is made the new row is created at the bottom of that bands grid.
Please let me know if you have any ideas of what may be causing this.
thanks.
-Chad
jaya kumar said
Excel Like Add Rows Above, Below at client side in Infragistics UltraWebGrd
unable to open XLGrid Sample 1.
I want to add a new row after or before the selected row in ultrawebgrid. Can any one help me
uday said
Hi Senthil,
Iam unable to download ur source code page not found error..
Vivek said
Hi senthil,
Not able to get the source code. Can u post it again?
Thanks for help
Regards,
Vivek
Asif said
Hi
The sample code is not in the given link http://www.senthilsweb.com/upload/XLLikeGrid.zip. Can you give the updated link. Or tell me how can I call the igtbl_addNew() function at the client side event of the UltraWebgrid. Please reply if you @ the earliest it’s a project requirement. Any help is really appreciated.
Jill said
Hi Senthil,
I was not able to open the XLGrid Sample demo site and also to download the source code. Can you please post another again?
Thank yuou very much.