Hello,
I'm currently converting a windows forms application to the web. The screen I have a problem with contains a hierarchical grid. Each level contains the same columns (14 total) with most columns hidden by default. I want the column chooser functionalitity, column moving and column resizing functionality to synchronize between each level/band.
In WinForms grid I solved it by subscribing to the "AfterColPosChanged" event.
private void grdTimeInfos_AfterColPosChanged(object sender, AfterColPosChangedEventArgs e){ //create and get the Grids Event manager. GridEventManager gridEventManager = grdTimeInfos.Base.EventManager; //We need to turn off the AfterColPosChanged event so it wont be called over and over agin when we //change the position of the bands in the subsequent bands. gridEventManager.SetEnabled(GridEventIds.AfterColPosChanged, false); //call the Synchronize method SynchronizeColumns(e.ColumnHeaders, e.PosChanged); //Turn the event back on so it will work next time gridEventManager.SetEnabled(GridEventIds.AfterColPosChanged, true);}
private void grdTimeInfos_AfterColPosChanged(object sender, AfterColPosChangedEventArgs e){ //create and get the Grids Event manager. GridEventManager gridEventManager = grdTimeInfos.Base.EventManager;
//We need to turn off the AfterColPosChanged event so it wont be called over and over agin when we //change the position of the bands in the subsequent bands. gridEventManager.SetEnabled(GridEventIds.AfterColPosChanged, false);
//call the Synchronize method SynchronizeColumns(e.ColumnHeaders, e.PosChanged);
//Turn the event back on so it will work next time gridEventManager.SetEnabled(GridEventIds.AfterColPosChanged, true);}
The synchronizecolumns method handles the 3 possible change events: move, swap and visibliltiy change.
private void SynchronizeColumns(ColumnHeader[] columHeaders, PosChanged positionChanged){ switch (positionChanged) { case PosChanged.Moved: //iterate through the Bands Collection foreach (UltraGridBand band in grdTimeInfos.Base.DisplayLayout.Bands) { //make sure that we don't move the same band column that we moved if (band.Key != columHeaders[0].Band.Key) { //for moving, we only need to worry about visiblePostions. So, all we do is //set the visible position of the grid column in the next band which //has the same key as ColumnHeader[0] band.Columns[columHeaders[0].Column.Key].Header.VisiblePosition = columHeaders[0].VisiblePosition; } } break; case PosChanged.Swapped: //iterate throug the Bands Collection foreach (UltraGridBand band in grdTimeInfos.Base.DisplayLayout.Bands) { //make sure that we don't swap the same band columns that we just swapped if (band.Key != columHeaders[0].Band.Key) { //use the swap method on the colum to swap the two columns that we get from the //olumnHeader array. band.Columns[columHeaders[1].Column.Key].Swap(band.Columns[columHeaders[0].Column.Key]); } } break; case PosChanged.HiddenStateChanged: //iterate throug the Bands Collection foreach (UltraGridBand band in grdTimeInfos.Base.DisplayLayout.Bands) { if (band.Key != columHeaders[0].Band.Key) { band.Columns[columHeaders[0].Column.Key].Hidden = columHeaders[0].Column.Hidden; } } break; }}
private void SynchronizeColumns(ColumnHeader[] columHeaders, PosChanged positionChanged){ switch (positionChanged) { case PosChanged.Moved: //iterate through the Bands Collection
foreach (UltraGridBand band in grdTimeInfos.Base.DisplayLayout.Bands) { //make sure that we don't move the same band column that we moved if (band.Key != columHeaders[0].Band.Key) { //for moving, we only need to worry about visiblePostions. So, all we do is //set the visible position of the grid column in the next band which //has the same key as ColumnHeader[0] band.Columns[columHeaders[0].Column.Key].Header.VisiblePosition = columHeaders[0].VisiblePosition; } }
break; case PosChanged.Swapped: //iterate throug the Bands Collection
foreach (UltraGridBand band in grdTimeInfos.Base.DisplayLayout.Bands) { //make sure that we don't swap the same band columns that we just swapped
if (band.Key != columHeaders[0].Band.Key) { //use the swap method on the colum to swap the two columns that we get from the //olumnHeader array. band.Columns[columHeaders[1].Column.Key].Swap(band.Columns[columHeaders[0].Column.Key]); } }
break; case PosChanged.HiddenStateChanged: //iterate throug the Bands Collection
foreach (UltraGridBand band in grdTimeInfos.Base.DisplayLayout.Bands) { if (band.Key != columHeaders[0].Band.Key) { band.Columns[columHeaders[0].Column.Key].Hidden = columHeaders[0].Column.Hidden; } }
break; }}
Now I want to implement the same functionality in the web interface.Has something like this be done already, or can you point me to the correct event(s) I need to use to accomplish this?
A challenge!
Kind regards,
Michael
I have a similar problem I am trying to run the igTreeGrid example code but modify it to have resizeable columns, and moveable columns. I can get it to work if I don't include the treegrid script at the top but that doesn't seem like a very good idea to me. I tried pasting that children populated script, that you mentioned above, into the example code but that also didn't work(I'm thinking I may have to change some variable names but I am new to JavaScript so I'm not sure what to change.) Let me know if you can help.
Thanks,
Hello Michael,
Please let me know if you need further assistance with this issue and I will be glad to help.
Hi Michael,
Thanks for the update. I'm looking forward to hearing from you.
Thanks a lot for the supplied information. I will try it out as soon as possible.
Please let me know if you need further assistance with this issue.