Flexgrid Header Merging in VB

Flexgrid Header Merging in VB

Posted by: saidnai on 25 January 2021, 9:15 am EST

• 

  saidnai

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 25 January 2021, 9:15 am EST - Updated 3 October 2022, 11:24 pm EST

  Good day,

  I need your support for the following challenge: i have to build a Flexgrid that shows data as in the picture attached. So a Flexgrid with 3 headers following with data readed from the database if it exist otherwise it can be input from the user.

  In normal case i use the following code in VB for the Flexgird to Show data from the datatbase:

  SqlStr = “SELECT * From Table1”
  
  Dim Odbcda As New Odbc.OdbcDataAdapter(SqlStr, connectionString)
  
  odbcDataSet = New DataSet
  
  Odbcda.Fill(odbcDataSet, “Liste”)
  
  Dim dt As DataTable = odbcDataSet.Tables(“Liste”)
  
  DGU.DataSource = dt
  
  With flexgrid
  
  .Cols(1).Caption = “Fld1”
  
  .Cols(1).Width = 50
  
  .Cols(2).Caption = “Fld2”
  
  .Cols(2).Width = 50
  
  .Cols(3).Caption = “Fld3”
  
  .Cols(3).Width = 50
  
  .Cols(4).Caption = “Fld4”
  
  .Cols(4).Width = 50
  
  .Cols(5).Caption = “Fld5”
  
  .Cols(5).Width = 50
  
  .Cols(6).Caption = “Fld6”
  
  .Cols(6).Width = 50
  
  .Cols(7).Caption = “Fld7”
  
  .Cols(7).Width = 50
  
  .Cols(8).Caption = “Fld8”
  
  .Cols(8).Width = 50
  
  .Cols(9).Caption = “Fld9”
  
  .Cols(9).Width = 50
  
  .Cols(10).Caption = “Remark”
  
  .Cols(10).Width = 50
  
  End With

  Can you please support and provid a VB Sample to get the Flexgrid with 3 headers as in the Picture?

  Best regards
  
  Said
  
  

  

  1008×190 32.1 KB

  

• 

  wknauf

  • Post Options:
  • Link
    Copy

  Posted 27 January 2021, 3:34 am EST

  Hi,

  you probably populate the grid yourself, not by using data binding?
  
  Attached sample shows how to create the headers:

  
      flexGrid.Cols.Count = 3
      flexGrid.Cols.Fixed = 0
  
      flexGrid.Rows.Count = 10
      flexGrid.Rows.Fixed = 3
  
      flexGrid.AllowMergingFixed = C1.Win.C1FlexGrid.AllowMergingEnum.Free
  
      flexGrid.Rows(0).AllowMerging = True
      flexGrid.Rows(1).AllowMerging = True
      flexGrid.Rows(2).AllowMerging = True
  
      flexGrid.Cols(0).TextAlignFixed = C1.Win.C1FlexGrid.TextAlignEnum.CenterTop
      flexGrid.Cols(1).TextAlignFixed = C1.Win.C1FlexGrid.TextAlignEnum.CenterTop
      flexGrid.Cols(2).TextAlignFixed = C1.Win.C1FlexGrid.TextAlignEnum.CenterTop
  
      flexGrid(0, 0) = "Text1"
      flexGrid(0, 1) = "Text1"
      flexGrid(0, 2) = "Text1"
  
      flexGrid(1, 0) = "%"
      flexGrid(1, 1) = "%"
  
      flexGrid(2, 0) = "> x"
      flexGrid(2, 1) = "< x"
  
      'Create cell styles:
      Dim style1 As CellStyle = flexGrid.Styles.Add("Headerstyle1", flexGrid.Styles.Fixed)
      style1.BackColor = Color.BlueViolet
      flexGrid.SetCellStyle(1, 0, style1)
      flexGrid.SetCellStyle(1, 1, style1)
      flexGrid.SetCellStyle(2, 0, style1)
      flexGrid.SetCellStyle(2, 1, style1)
  
      Dim style2 As CellStyle = flexGrid.Styles.Add("Headerstyle2", flexGrid.Styles.Fixed)
      style2.BackColor = Color.Turquoise
      flexGrid.SetCellStyle(1, 2, style2)
      flexGrid.SetCellStyle(2, 2, style2)
  
  

  FlexHeader.zip

  Hope this helps

  Wolfgang

• 

  prabhat.sharma

  

  • Post Options:
  • Link
    Copy

  Posted 27 January 2021, 8:55 am EST

  Hi,

  You need to first increase the number of fixed rows(header rows) which you can do using the Fixed property of Row collection of the grid. Then you need to set the grid’s AllowMerging property to FixedOnly. Then, designate the rows and columns that you want to merge by setting the row and column’s AllowMerging properties. Finally, you need to assign the text to the header cells so that the cells you want to merge have the same contents. Please refer to the sample attached and documentation link https://www.grapecity.com/componentone/docs/win/online-flexgrid/mergedtableheaders.html.

  @Wolfgang, thank you for your help.

  If you have any questions, please let us know.

  Regards,
  
  Prabhat Sharma.
  
  FGHeaderMerge.zip

• 

  saidnai

  • Post Options:
  • Link
    Copy

  Posted 29 January 2021, 11:32 am EST - Updated 3 October 2022, 11:24 pm EST

  Dear Prabhat, Dear Wolfgang,

  I have used your sample, It is very very useful. I have learned a lot from it.
  
  Attached the result reached. I am trying to get cell colors in.

  Best regards
  
  Said
  
  

  

  1646×61 26.5 KB

• 

  wknauf

  • Post Options:
  • Link
    Copy

  Posted 29 January 2021, 12:09 pm EST

  Hi Said,

  the cell background colors were part of my sample ;-).

  Best regards

  Wolfgang

• 

  prabhat.sharma

  

  • Post Options:
  • Link
    Copy

  Posted 1 February 2021, 2:23 am EST

  Hi,
  
  You can easily change the cell color by using the cell style associated with the cell. You either can use the method mentioned by Wolfgang i.e. using the SetCellStyle() method to set the style for each cell or you can use the cell range to set the style for a range of cells. You can use the GetCellRange() method to get a range of cells and then you can use the StyleNew property of cell range which gets or sets the style used to display every cell in the range, creating a new style if necessary. Once you have the cell style, you can use the BackColor property of the cell style to change the color of the cell. Please refer to the sample attached.
  
  If you have any questions, please let us know.
  
  Regards,
  
  Prabhat Sharma.
  
  FGHeaderMerge_mod.zip

• 

  saidnai

  • Post Options:
  • Link
    Copy

  Posted 1 February 2021, 4:14 am EST

  Dear Prabhat, Dear Wolfgang,

  The first sample was without color assignement. The second was with. Anyway. It is perfect.

  Thanks to you all
  
  Said