Different row data types in same column?

46 posts, 4 answers
  1. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 21 Sep 2018 Link to this post

    Hello,

    I had a question in regards to how you need to bind/set the data type of a GridView. When I'm doing column creation, you need to set the data type of the column to all be of one type (i.e. text, date, drop down list, etc). Is there a way around this? Basically I want to have one column be of a general Data type and have each row determine what to put into the cell.

    I've attached an image of the "gridview" that I'm trying to recreate in winforms. Any and all help is very much appreciated!

    Thanks

  2. Dess | Tech Support Engineer, Sr.
    Admin
    Dess | Tech Support Engineer, Sr.  avatar
    3759 posts

    Posted 24 Sep 2018 Link to this post

    Hello, Braden,  
     
    RadGridView provides a variety of visual cells (all inheriting from GridCellElement) with different functionality and purpose. All these cover the standard cases of the control usage. In case you need to implement more specific and custom scenario, you can create a custom cell. RadGridView provides a powerful and flexible mechanism for creating cell types with custom content elements, functionality and properties. The following help article demonstrates a sample approach how to create a custom cell: https://docs.telerik.com/devtools/winforms/gridview/cells/creating-custom-cells

    In the CreateChildElements you can create all possible elements that can be displayed in the column. Then, in the SetContentCore method you can control which elements to be visible or not considering the data row. You can show/hide a certain child element by manipulating its Visibility property. Note that due to the UI virtualization in RadGridView, cell elements are created only for currently visible cells and are being reused during operations like scrolling, filtering, grouping and so on. In order to prevent showing some undesired elements for the incorrect data rows, make sure that you hide/show the respective child elements in the SetContentCore method.

    I hope this information helps. 

    Regards,
    Dess
    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.
  3. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 24 Sep 2018 in reply to Dess | Tech Support Engineer, Sr. Link to this post

    Thanks for your reply! My only question lies in the part of generating the CellElement object inside the constructor: 

    Since the constructor requires a column and row parameter, how do they call a parameterless constructor in the CreateChildElements override? 

    public ProgressBarCellElement(GridViewColumn column, GridRowElement row) : base(column, row)
    {
    }

     

    private RadProgressBarElement radProgressBarElement;
     
    protected override void CreateChildElements()
    {
        base.CreateChildElements();
     
        radProgressBarElement = new RadProgressBarElement();
        this.Children.Add(radProgressBarElement);
    }

     

    My visual studio shows an error that says: There is no argument given that corresponds to the required formal parameter 'column' of 'PNUDFCellElement.PNUDFCellElement(GridViewColumn, GridRowElement)'

    Let me know if you have a solution. Thanks!

  4. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 24 Sep 2018 in reply to Braden Link to this post

    Here's my code: 

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using System.Threading.Tasks;
    using Telerik.WinControls.UI;
     
    namespace Legacymfg.Komodo.PN
    {
        public class PNUDFCellElement : GridDataCellElement
        {
            public PNUDFCellElement(GridViewColumn column, GridRowElement row) : base(column, row)
            {
            }
     
            private PNUDFCellElement udfCellElement;
     
            protected override void CreateChildElements()
            {
                base.CreateChildElements();
     
                udfCellElement = new PNUDFCellElement();
                this.Children.Add(udfCellElement);
            }
        }
    }
  5. Dess | Tech Support Engineer, Sr.
    Admin
    Dess | Tech Support Engineer, Sr.  avatar
    3759 posts

    Posted 25 Sep 2018 Link to this post

    Hello, Braden,  

    The CreateChildElements method is called before the constructor is executed. As it is demonstrated in the referred help article, you need to pass the column and the row in the constructor. I have attached a sample project for your reference.

    You can refer to our Demo application >> GridView >> Columns >> Column Types example where the last column is a custom one where the child elements in the cells are added in the CellFormatting event. You can also explore the code by selecting C# or VB on the top right side. 

    Feel free to use this approach which suits your requirement best.

    I hope this information helps. 

    Regards,
    Dess
    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.
  6. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 25 Sep 2018 in reply to Dess | Tech Support Engineer, Sr. Link to this post

    Thank you! I think I was just getting confused since the class is ProgressBarCellElement and then when you're adding child elements it's a RadProgressBarElement... after reading your first reply again I think I understand more.

    I think I can figure it out from here -- but I will reply back if I can't! I appreciate the help.

    Braden

  7. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 25 Sep 2018 in reply to Dess | Tech Support Engineer, Sr. Link to this post

    After looking at the custom (progressbar) example code, I still don't understand how I will bind different data types (datetime, drop down list, text box) into my one column. Here is their code for creating the column: 

    GridViewDataColumn commandColumn = new GridViewTextBoxColumn();
                commandColumn.HeaderText = "Custom";
                commandColumn.Name = "ProgressBar";
                commandColumn.DataType = typeof(int);
                commandColumn.ReadOnly = true;
                commandColumn.Width = 100;
                this.radGridView1.Columns.Add(commandColumn);

     

    However, my data type will not always be int...is there a way around this? Can I just not set the column data type? Thanks!

  8. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 25 Sep 2018 in reply to Braden Link to this post

    To update, I have tried creating a custom cell and populating the children with the proper data controls: 

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using System.Threading.Tasks;
    using Telerik.WinControls.UI;
     
    namespace Legacymfg.Komodo.PN
    {
        public class PNUDFCellElement : GridDataCellElement
        {
            public PNUDFCellElement(GridViewColumn column, GridRowElement row) : base(column, row)
            {
            }
     
            private RadDropDownListElement radDropDownListElement;
            private RadDateTimeEditorElement radDateTimeEditorElement;
            private RadTextBoxElement radTextBoxElement;
     
            protected override void CreateChildElements()
            {
                base.CreateChildElements();
     
                radDropDownListElement = new RadDropDownListElement();
                radDateTimeEditorElement = new RadDateTimeEditorElement();
                radTextBoxElement = new RadTextBoxElement();
     
                this.Children.Add(radDropDownListElement);
                this.Children.Add(radDateTimeEditorElement);
                this.Children.Add(radTextBoxElement);
            }
     
            protected override void SetContentCore(object value)
            {
                base.SetContentCore(value);
     
     
            }
     
            public class CustomDataColumn : GridViewDataColumn
            {
                public CustomDataColumn(string fieldName) : base(fieldName)
                {
                }
     
                public override Type GetCellType(GridViewRowInfo row)
                {
                    if (row is GridViewDataRowInfo)
                    {
                        return typeof(PNUDFCellElement);
                    }
                    return base.GetCellType(row);
                }
            }
        }
    }

     

    However, when I try to add the column it is formatted strangely (like there is a big white box over the editable text field -- see attached picture). 

    GridViewTextBoxColumn Name = new GridViewTextBoxColumn();
                Name.Name = "Name_Column";
                Name.HeaderText = "Name";
                Name.DataType = typeof(string);
                Name.MinWidth = 250;
                UserDefinedFieldsGridView.MasterTemplate.Columns.Add(Name);
     
    CustomDataColumn customDataColumn = new CustomDataColumn("Data Column");
                customDataColumn.HeaderText = "Data";
                customDataColumn.Name = "Data_Column";
                customDataColumn.DataType = typeof(PNUDFCellElement);
                customDataColumn.ReadOnly = true;
                customDataColumn.Width = 250;
                UserDefinedFieldsGridView.MasterTemplate.Columns.Add(customDataColumn);

     

    Basically my end goal is this: determine which of the 3 options to display for the cell data type (i.e. if the "name" column is DateAdded then the "data" column should be a date time picker. if the name column is something that refers to a drop down list of options, the data column should be a drop down list....etc) and then populate the data column with the appropriate control. If you have an example of something like that it would help a lot! Thanks so much for your help

  9. Dess | Tech Support Engineer, Sr.
    Admin
    Dess | Tech Support Engineer, Sr.  avatar
    3759 posts

    Posted 26 Sep 2018 Link to this post

    Hello, Braden,  

    The ProgressBarCellElement class represents the custom implementation of the cell element in RadGridView. The added RadProgressBarElement is the custom element that is added to Children collection of the cell. It can be any other element that you would like to add, e.g. RadButtonElement, RadLabelElement, RadDateTimePickerElement etc. It is possible to add all of the 3 elements inside a StackLayoutElement which is used as a container. You can find below a sample code snipept demonstrating how to add 3 different elements and show each of them and hiding the rest considering the row index.

    public class PNUDFCellElement : GridDataCellElement
        {
            public PNUDFCellElement(GridViewColumn column, GridRowElement row) : base(column, row)
            {
            }
     
            private StackLayoutElement stack;
            private RadDropDownListElement radDropDownListElement;
            private RadDateTimeEditorElement radDateTimeEditorElement;
            private RadTextBoxControlElement radTextBoxElement;
     
            protected override void CreateChildElements()
            {
                base.CreateChildElements();
                stack = new StackLayoutElement();
                stack.StretchHorizontally = true;
                stack.Orientation = Orientation.Horizontal;
                radDropDownListElement = new RadDropDownListElement();
                radDropDownListElement.DropDownStyle = Telerik.WinControls.RadDropDownStyle.DropDownList;
                radDropDownListElement.StretchHorizontally = true;
                radDateTimeEditorElement = new RadDateTimeEditorElement();
                radDateTimeEditorElement.StretchHorizontally = true;
                radTextBoxElement = new RadTextBoxControlElement();
                radTextBoxElement.StretchHorizontally = true;
                stack.Children.Add(radDropDownListElement);
                stack.Children.Add(radDateTimeEditorElement);
                stack.Children.Add(radTextBoxElement);
                this.Children.Add(stack);
            }
     
            protected override void SetContentCore(object value)
            {
                this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
                this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
                this.radDateTimeEditorElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
     
                this.DrawText = false;
                if (this.RowIndex % 3 == 0)
                {
                    this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                    this.radDropDownListElement.Text = this.Value + "";
                }
                else if (this.RowIndex % 3 == 1)
                {
                    this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                    this.radTextBoxElement.Text = this.Value + "";
                }
                else
                {
                    this.radDateTimeEditorElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                }
     
                base.SetContentCore(value);
            }
     
            public class CustomDataColumn : GridViewDataColumn
            {
                public CustomDataColumn(string fieldName) : base(fieldName)
                {
                }
     
                public override Type GetCellType(GridViewRowInfo row)
                {
                    if (row is GridViewDataRowInfo)
                    {
                        return typeof(PNUDFCellElement);
                    }
                    return base.GetCellType(row);
                }
            }
        }

    However, it is important to note that RadDropDownListElement, RadTextBoxElement and RadDateTimePickerElement host the MS TextBox. Using controls in grid cells may slow down the scrolling and will cause visual glitches as they do not support clipping. This is the result you obtained in the screenshot. Instead of using RadTextBoxElement, feel free to use a RadTextBoxControlElement which doesn't host the MS TextBox. For the RadDropDownListElement, you can set the DropDownStyle property to DropDownList. Thus, the hosted MS TextBox will be hidden and you will be able to select the items from the drop down only. As to the RadDateTimePickerElement, there is not suitable mode that I can suggest in order to hide the hosted TextBox. A better option would be using custom editors. Thus, you can construct the desired editor and activate it for the respective cell. 
    https://docs.telerik.com/devtools/winforms/gridview/editors/using-custom-editors
    https://docs.telerik.com/devtools/winforms/gridview/editors/how-to/change-the-active-editor-depending-on-the-cell-value-type.

    I hope this information helps. 

    Regards,
    Dess
    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.
  10. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 26 Sep 2018 in reply to Dess | Tech Support Engineer, Sr. Link to this post

    Thank you Dess! I appreciate the feedback - I will try to implement this approach and see if it's successful :) 
  11. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 27 Sep 2018 in reply to Dess | Tech Support Engineer, Sr. Link to this post

    Is there a way to populate different rows drop down lists from the database? For example...I have a field for Item Category that has text values and then a Freight Class category that has integers.

    Here is my code where I'm querying the database for the drop down list options (FldValue - Descr), if it's null (I want to make it a text box), else (populate the drop down list options for that specific row, then show that row, then clear the items for the next iteration). 

    Instead, I'm left with all of the items as empty drop down lists. FYI - not all of the rows with dataType 'A' have drop down list options... that's where the additional query is looking.

    Hashtable itemGrpName = new Hashtable();
                Hashtable dataType = new Hashtable();
     
    foreach (DataRow dr in itemGroupName.Rows)
                {
                    //here we add the value of the field to a hash as the value, with the row index (count) as the key
                    itemGrpName.Add(count, dr["Descr"]);
                    dataType.Add(count, dr["TypeID"]);
     
                    count++;
                }
     
    //loop through all the row indexes, find the data type, and set the elements visibility accordingly
                for(int i=0; i<itemGrpName.Count; i++)
                {
                    object val = dataType[i];
                    string data = val.ToString(); //our data type, 'a', 'n', or 'd'
     
                    //indices are consistent between the two hashtables...
     
                    //now we do our data control setup...
                    switch (data)
                    {
                        //alphanumeric -- check for drop down options and populate where appropriate
                        case "A":
                            string getDDLoptionsQry = "select t0.FldValue, t0.Descr from prod.dbo.UFD1 t0 " +
                            " join prod.dbo.CUFD t1 on t1.FieldID = t0.FieldID " +
                            " where t0.TableID = 'OITM' and t1.TableID = 'OITM' " +
                            " and t1.Descr = '";
     
                            getDDLoptionsQry += itemGrpName[i] + "'";
     
                            //check if results are null...
     
                            dropDownListTable = SQLDataAccess.DTFromQuery("Komodo", getDDLoptionsQry);
     
                            //if (null): no drop down options, so just populate text box
     
                            if (dropDownListTable.Rows.Count == 0)
                            {
                                //show empty text box here
                            }
     
                            //else: drop down options, set them up and show the drop down element
                            else
                            {
                                //List<string> ddlOptionsList = new List<string>();
                                int j = 0;
                                this.radDropDownListElement.Items.Clear();
                                foreach (DataRow dr in dropDownListTable.Rows)
                                {
                                     
                                    RadListDataItem ddlDataItem = new RadListDataItem();
                                    ddlDataItem.Text = dr["FldValue"].ToString() + " - " + dr["Descr"].ToString();
                                    this.radDropDownListElement.Items.Insert(j, ddlDataItem);
                                    j++;
                                    //ddlOptionsList.Add(dr["FldValue"].ToString() + " - " + dr["Descr"].ToString());
                                }
     
                                this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                                this.radDropDownListElement.Text = this.Value + "";
                                 
                            }

    Let me know if you have any questions/need clarification of the problem! Thanks

  12. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 27 Sep 2018 in reply to Braden Link to this post

    Here's what my data looks like (Item Category and then Freight class -- just to give you a better idea of what I'm trying to do)

     

    I tried to clear the items because what was happening originally was that every single row had a drop down list with every single option - which is not what I wanted

  13. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 27 Sep 2018 in reply to Braden Link to this post

    Here is what I was referring to (see image) and here is the corresponding code! Another problem is that both the text box and the drop down list are visible...when I only want one or the other depending on what the datatype for that row is:

    switch (data)
                    {
                        //alphanumeric -- check for drop down options and populate where appropriate
                        case "A":
                            string getDDLoptionsQry = "select t0.FldValue, t0.Descr from prod.dbo.UFD1 t0 " +
                            " join prod.dbo.CUFD t1 on t1.FieldID = t0.FieldID " +
                            " where t0.TableID = 'OITM' and t1.TableID = 'OITM' " +
                            " and t1.Descr = '";
     
                            getDDLoptionsQry += itemGrpName[i] + "'";
     
                            //check if results are null...
     
                            dropDownListTable = SQLDataAccess.DTFromQuery("Komodo", getDDLoptionsQry);
     
                            //if (null): no drop down options, so just populate text box
     
                            if (dropDownListTable.Rows.Count == 0)
                            {
                                //show empty text box here
                                this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                                this.radTextBoxElement.Text = this.Value + "";
                                //this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
                            }
     
                            //else: drop down options, set them up and show the drop down element
                            else
                            {
                                //List<string> ddlOptionsList = new List<string>();
                                int j = 0;
                                //this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
                                //this.radDropDownListElement.Items.Clear();
                                foreach (DataRow dr in dropDownListTable.Rows)
                                {
                                     
                                    RadListDataItem ddlDataItem = new RadListDataItem();
                                    ddlDataItem.Text = dr["FldValue"].ToString() + " - " + dr["Descr"].ToString();
                                    this.radDropDownListElement.Items.Insert(j, ddlDataItem);
                                    j++;
                                    //ddlOptionsList.Add(dr["FldValue"].ToString() + " - " + dr["Descr"].ToString());
                                }
     
                                this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                                this.radDropDownListElement.Text = this.Value + "";
                                 
                            }

     

    Any and all help is greatly appreciated :) Thanks so much

  14. Dess | Tech Support Engineer, Sr.
    Admin
    Dess | Tech Support Engineer, Sr.  avatar
    3759 posts

    Posted 28 Sep 2018 Link to this post

    Hello, Braden, 

    In order to see only the drop down in the custom cell, make sure that the Visibility property is set to Collapsed for the text box in the SetContentCore method. This is the appropriate place to synchronize the displayed data considering the data row of the cell element. As to the items in the drop down, you can also set the DataSource property to a subset of the list that is originally assigned to the drop down in the SetContentCore method. Thus, you can control which items to be visible for the different rows.

    I hope this information helps. If you need any further assistance please don't hesitate to contact me. 

    Regards,
    Dess
    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.
  15. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 28 Sep 2018 in reply to Dess | Tech Support Engineer, Sr. Link to this post

    I really appreciate the help! I do have another question regarding the StretchHorizontally property of the RadElements...

    My gridview looks like the image below, but obviously I'd like the input fields to stretch and take up the whole column length. Any idea why this is happening?

    Also - do you have any example code of setting the DataSource property to be a subset of a drop down list? That would be a great help because I'm just not quite sure how to do that properly.

    Thanks! I sincerely appreciate all of your help.

  16. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 28 Sep 2018 in reply to Dess | Tech Support Engineer, Sr. Link to this post

    I am also seeing a few other issues:

    1) The drop down list selections are getting added multiple times. Here's my code for that part: 

    See attached image for a visual representation. The Freight Class options should only have numbers - no Yes/No or other options that you can see from the picture.

    01.//maybe we can do a comparison of the RowIndex and the hashtable datatype to figure out what to display...
    02.            //set visibility of data column cells depending on the data type of the corresponding ItemGrpName cell
    03.            foreach (int index in dataType.Keys)
    04.            {
    05.                if (index.Equals(this.RowIndex))
    06.                {
    07.                    switch (dataType[index].ToString())
    08.                    {
    09.                        case "A":
    10.                            this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
    11.                            this.radDropDownListElement.Text = this.Value + "";
    12. 
    13.                            string getDDLoptionsQry = "select t0.FldValue, t0.Descr from prod.dbo.UFD1 t0 " +
    14.                            " join prod.dbo.CUFD t1 on t1.FieldID = t0.FieldID " +
    15.                            " where t0.TableID = 'OITM' and t1.TableID = 'OITM' " +
    16.                            " and t1.Descr = '";
    17. 
    18.                            getDDLoptionsQry += itemGrpName[index] + "'";
    19. 
    20.                            //check if results are null...
    21. 
    22.                            dropDownListTable = SQLDataAccess.DTFromQuery("Komodo", getDDLoptionsQry);
    23. 
    24.                            //if (null): no drop down options, so just populate text box
    25. 
    26.                            if (dropDownListTable.Rows.Count == 0)
    27.                            {
    28.                                //show empty text box here
    29.                                this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
    30.                                this.radTextBoxElement.Text = this.Value + "";
    31.                                this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
    32.                            }
    33. 
    34.                            //else: drop down options, set them up and show the drop down element
    35.                            else
    36.                            {
    37.                                //List<string> ddlOptionsList = new List<string>();
    38.                                int j = 0;
    39.                                this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
    40.                                //this.radDropDownListElement.Items.Clear();
    41.                                foreach (DataRow dr in dropDownListTable.Rows)
    42.                                {
    43. 
    44.                                    RadListDataItem ddlDataItem = new RadListDataItem();
    45.                                    ddlDataItem.Text = dr["FldValue"].ToString() + " - " + dr["Descr"].ToString();
    46.                                    this.radDropDownListElement.Items.Insert(j, ddlDataItem);
    47.                                    j++;
    48.                                    //ddlOptionsList.Add(dr["FldValue"].ToString() + " - " + dr["Descr"].ToString());
    49.                                }
    50. 
    51.                                //this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
    52.                                //this.radDropDownListElement.Text = this.Value + "";
    53. 
    54.                            }
    55. 
    56.                            break;
    57.                        case "B":
    58.                            this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
    59.                            this.radTextBoxElement.Text = this.Value + "";
    60.                            break;
    61.                        case "N":
    62.                            this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
    63.                            this.radTextBoxElement.Text = this.Value + "";
    64.                            break;
    65.                        case "D":
    66.                            this.radDateTimeEditorElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
    67.                            break;
    68. 
    69. 
    70.                    }
    71.                }
    72.            }

     

    2) I'm also seeing an additional vertical scrollbar in the gridview... I'll demonstrate what I mean in some images. Once I scroll around a bit it appears over the "normal" scrollbar and only moves the gridview up and down instead of the values inside the gridview (hard to explain without showing in real time)

    Again, I really appreciate your help through this! It's not easy that's for sure haha. 

  17. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 28 Sep 2018 in reply to Braden Link to this post

    After a bit of investigating/debugging it seems like the extra DDL categories are being added to the rows as I'm scrolling down (i.e. they are not on the default gridview when the tab/page is loading). Thought that this might be of some help. Thanks!
  18. Hristo
    Admin
    Hristo avatar
    1519 posts

    Posted 01 Oct 2018 Link to this post

    Hi Braden,

    Regarding your question about having different data displayed in the drop-down list editors, please check the following KB resource discussing a similar setup and suggesting a possible solution rebinding the editor: https://www.telerik.com/support/kb/winforms/gridview/details/cascading-comboboxes-in-radgridview. As for the image with the editors, not filling up the entire width, it appears that they have been arranged in such a way. I am assuming that you might be hiding some of the other elements in the custom cell, in this case instead of hiding set their Visibility property to ElementVisibility.Collapsed. This way the collapsed elements will not be measured and arranged while updating the layout. In the custom cell, it is also possible to override its MeasureOverride and ArrangeOverride methods where you can specify the exact bounds and position of the elements.

    As for the grey scrollbar, it might be related to the hierarchy of the custom element. Please note, however, that without actually having your implementation it is hard to make a correct assumption. If it is possible, you can share a code snippet with your implementation and details how it can be tested.

    Regards,
    Hristo
    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.
  19. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 01 Oct 2018 in reply to Hristo Link to this post

    Thank you Hristo! I will have a look at that article and the feedback you sent me. If I am still having trouble, I'll try and save my project as a zip and see if I can upload it/show you somehow. I appreciate all the help!
  20. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 01 Oct 2018 in reply to Hristo Link to this post

    Here is a code snippet of my custom cell class now -- as you can see I am setting the visibility to Collapsed but I am still not seeing the results I have intended. Maybe I will try overriding the Measure/Arrange Override methods and see if I can have success that way. 

    Let me know if you have any suggestions/ideas for how to implement this! Thanks. 

    using Legacymfg.Komodo.Data;
    using System;
    using System.Collections;
    using System.Collections.Generic;
    using System.Data;
    using System.Linq;
    using System.Text;
    using System.Threading.Tasks;
    using System.Windows.Forms;
    using Telerik.WinControls.UI;
     
    namespace Legacymfg.Komodo.PN
    {
        public class PNUDFCellElement : GridDataCellElement
        {
            public PNUDFCellElement(GridViewColumn column, GridRowElement row) : base(column, row)
            {
            }
     
            private StackLayoutElement stack;
            private RadDropDownListElement radDropDownListElement;
            private RadDateTimeEditorElement radDateTimeEditorElement;
            private RadTextBoxControlElement radTextBoxElement;
            DataTable itemGroupName;
            DataTable dropDownListTable;
     
            protected override void CreateChildElements()
            {
                base.CreateChildElements();
                stack = new StackLayoutElement();
                stack.StretchHorizontally = true;
                stack.Orientation = Orientation.Horizontal;
                radDropDownListElement = new RadDropDownListElement();
                radDropDownListElement.DropDownStyle = Telerik.WinControls.RadDropDownStyle.DropDownList;
                radDropDownListElement.StretchHorizontally = true;
                radDateTimeEditorElement = new RadDateTimeEditorElement();
                radDateTimeEditorElement.StretchHorizontally = true;
                radTextBoxElement = new RadTextBoxControlElement();
                radTextBoxElement.StretchHorizontally = true;
                stack.Children.Add(radDropDownListElement);
                stack.Children.Add(radDateTimeEditorElement);
                stack.Children.Add(radTextBoxElement);
                this.Children.Add(stack);
            }
     
            protected override void SetContentCore(object value)
            {
                this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
                this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
                this.radDateTimeEditorElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
     
                this.DrawText = false;
                 
                //here we need to check the corresponding row index (maybe create an array?)
                //to determine which data type we want to show for that row
     
                int count = 0;
                Hashtable itemGrpName = new Hashtable();
                Hashtable dataType = new Hashtable();
     
                itemGroupName = MasterDataCache.Instance.UDFDT;
     
                foreach (DataRow dr in itemGroupName.Rows)
                {
                    //here we add the value of the field to a hash as the value, with the row index (count) as the key
                    itemGrpName.Add(count, dr["Descr"]);
                    dataType.Add(count, dr["TypeID"]);
     
                    count++;
                }
                /*
                //now here we need to check the row index against the hash values and verify we are showing the right data field(s)
                //if it's a drop down list that should also be handled (options)
     
                //first, get the data field type from the database, add that to another hash? or?
                //key the item group name and data type on the same index...or try to
     
                //then, check row index against the hash and display the right data control
                // A = alphanumeric
                // N = numeric
                // D = datetime
     
                */
     
                
                //maybe we can do a comparison of the RowIndex and the hashtable datatype to figure out what to display...
                //set visibility of data column cells depending on the data type of the corresponding ItemGrpName cell
                foreach (int index in dataType.Keys)
                {
                    if (index.Equals(this.RowIndex))
                    {
                        switch (dataType[index].ToString())
                        {
                            case "A":
                                 
     
                                string getDDLoptionsQry = "select t0.FldValue, t0.Descr from prod.dbo.UFD1 t0 " +
                                " join prod.dbo.CUFD t1 on t1.FieldID = t0.FieldID " +
                                " where t0.TableID = 'OITM' and t1.TableID = 'OITM' " +
                                " and t1.Descr = '";
     
                                getDDLoptionsQry += itemGrpName[index] + "'";
     
                                //check if results are null...
     
                                dropDownListTable = SQLDataAccess.DTFromQuery("Komodo", getDDLoptionsQry);
     
                                //if (null): no drop down options, so just populate text box
     
                                if (dropDownListTable.Rows.Count == 0)
                                {
                                    //show empty text box here
                                    this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                                    this.radTextBoxElement.Text = this.Value + "";
                                    this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
                                }
     
                                //else: drop down options, set them up and show the drop down element
                                else
                                {
                                    //List<string> ddlOptionsList = new List<string>();
                                    int j = 0;
                                    this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
                                    this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                                    this.radDropDownListElement.Text = this.Value + "";
                                    //this.radDropDownListElement.Items.Clear();
                                    foreach (DataRow dr in dropDownListTable.Rows)
                                    {
     
                                        RadListDataItem ddlDataItem = new RadListDataItem();
                                        ddlDataItem.Text = dr["FldValue"].ToString() + " - " + dr["Descr"].ToString();
                                        this.radDropDownListElement.Items.Insert(j, ddlDataItem);
                                        j++;
                                        //ddlOptionsList.Add(dr["FldValue"].ToString() + " - " + dr["Descr"].ToString());
                                    }
     
                                    //this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                                    //this.radDropDownListElement.Text = this.Value + "";
     
                                }
     
                                break;
                            case "B":
                                this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                                this.radTextBoxElement.Text = this.Value + "";
                                break;
                            case "N":
                                this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                                this.radTextBoxElement.Text = this.Value + "";
                                break;
                            case "D":
                                this.radDateTimeEditorElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                                this.radDateTimeEditorElement.Text = "";
                                break;
     
     
                        }
                    }
                }
     
                
                base.SetContentCore(value);
            }
     
            public class CustomDataColumn : GridViewDataColumn
            {
                public CustomDataColumn(string fieldName) : base(fieldName)
                {
                }
     
                public override Type GetCellType(GridViewRowInfo row)
                {
                    if (row is GridViewDataRowInfo)
                    {
                        return typeof(PNUDFCellElement);
                    }
                    return base.GetCellType(row);
                }
            }
        }
    }
  21. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 01 Oct 2018 in reply to Braden Link to this post

    Also, here is my code in the Form to generate the columns and row data :

    See the attached picture to see how it looks in my application. Thanks!

    private void PopulateUDFGridViewRows()
            {
     
                //clear it first
                UserDefinedFieldsGridView.Rows.Clear();
     
                udfTable = MasterDataCache.Instance.UDFDT;
     
                foreach (DataRow dr in udfTable.Rows)
                {
                    GridViewDataRowInfo rowInfo = new GridViewDataRowInfo(this.UserDefinedFieldsGridView.MasterView);
                    rowInfo.Cells[0].Value = dr["Descr"];
                    //figure out what type of control we need...
                    //i.e. text field, drop down list (combobox), or date (datetime)
                    UserDefinedFieldsGridView.Rows.Add(rowInfo);
                }
            }

     

    private void PopulateUDFGridViewColumns()
            {
                UserDefinedFieldsGridView.Columns.Clear();
                UserDefinedFieldsGridView.AutoGenerateColumns = false;
     
                GridViewTextBoxColumn Name = new GridViewTextBoxColumn();
                Name.Name = "Name_Column";
                Name.HeaderText = "Name";
                Name.DataType = typeof(string);
                Name.MinWidth = 250;
                UserDefinedFieldsGridView.MasterTemplate.Columns.Add(Name);
     
                CustomDataColumn customDataColumn = new CustomDataColumn("Data Column");
                customDataColumn.HeaderText = "Data";
                customDataColumn.Name = "Data_Column";
                customDataColumn.DataType = typeof(PNUDFCellElement);
                customDataColumn.ReadOnly = true;
                customDataColumn.Width = 500;
                UserDefinedFieldsGridView.MasterTemplate.Columns.Add(customDataColumn);
     
     
            }

     

  22. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 01 Oct 2018 in reply to Braden Link to this post

    As for testing, I'm not really sure how you would go about this since a lot of these forms/databases have underlying requirements you would need...but I'm thinking the idea should be the same. You can probably bind some test data to this (although I am binding it programmatically and not using any data binding code (just querying/getting results/assigning to variables etc).

    If you have any further questions don't hesitate to ask! Thanks again

  23. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 02 Oct 2018 in reply to Hristo Link to this post

    I have figured out the multiple(s) in the drop down list being added as I scroll (just needed to clear it before I added items in).

    I still need help figuring out the collapsed spacing (they are not being hidden properly and I am using the Collapse property), and the additional gray scroll bar! Please assist me if you can.

    Thanks,

    Braden

  24. Answer
    Hristo
    Admin
    Hristo avatar
    1519 posts

    Posted 03 Oct 2018 Link to this post

    Hello Braden,

    I looked further into the layout of the custom cell and it appears that there is an issue with the StackLayoutElement object. The issue is that the stack layout will also arrange the elements which are with a collapsed visibility. The item is logged on our feedback portal, here: FIX. TPF - the StackLayoutElement should respect the Visibility of the elements when arranging them. I have also updated your Telerik points. The issue is already being investigated and we will try to include a fix for it in the upcoming service pack release scheduled for later this month.

    A possible workaround is to use a custom StackLayoutElement as in the code snippet below: 
    public class CustomStackLayoutElement : StackLayoutElement
    {
        protected override void ArrangeHorizontally(SizeF finalSize)
        {
            RectangleF clientRect = this.GetClientRectangle(finalSize);
            float stretchableWidth = 0;
            int stretchableCount = 0;
     
            int nonStretchableItems = 0;
     
            foreach (RadElement element in this.Children)
            { if (element.Visibility == ElementVisibility.Collapsed)
                {
                    continue;
                }
                
     
                if (element.StretchHorizontally)
                {
                    stretchableCount++;
                }
                else
                {
                    stretchableWidth += element.DesiredSize.Width;
                    nonStretchableItems++;
                }
            }
     
            if (nonStretchableItems > 0)
            {
                stretchableWidth += ElementSpacing * (nonStretchableItems - 1);
            }
     
            int spacing = this.ElementSpacing;
     
            if (stretchableCount > 0)
            {
                stretchableWidth = (clientRect.Width - stretchableWidth) / stretchableCount;
                stretchableWidth -= spacing * stretchableCount;
            }
     
            ArrangeItemsHorizontaly(clientRect, finalSize, stretchableWidth, spacing);
        }
     
        protected override void ArrangeItemsHorizontaly(RectangleF clientRect, SizeF finalSize, float stretchableWidth, float spacing)
        {
            float x = clientRect.X;
            float y = clientRect.Y;
     
            List<RadElement> children = new List<RadElement>(this.Children);
     
            if (this.Comparer != null)
            {
                children.Sort(this.Comparer);
            }
     
            for (int i = 0; i < children.Count; i++)
            {
                RadElement element = null;
     
                if (this.RightToLeft && this.RightToLeftMode == RightToLeftModes.ReverseItems)
                {
                    element = children[children.Count - i - 1];
                }
                else
                {
                    element = children[i];
                }
     
                if (element.Visibility == ElementVisibility.Collapsed)
                {
                    continue;
                }
     
                RectangleF proposedRect = new RectangleF(x, y, stretchableWidth, clientRect.Height);
                RectangleF finalRect = AlignRect(element, proposedRect);
     
                if (this.RightToLeft && this.RightToLeftMode == RightToLeftModes.ReverseOffset)
                {
                    finalRect.X = finalSize.Width - x - finalRect.Width;
                }
     
                this.ArrangeElement(element, clientRect, finalRect, finalSize);
     
                x += finalRect.Width + spacing;
            }
        }
    }
     
    public class PNUDFCellElement : GridDataCellElement
    {
        public PNUDFCellElement(GridViewColumn column, GridRowElement row) : base(column, row)
        {
        }
     
        private CustomStackLayoutElement stack;
        private RadDropDownListElement radDropDownListElement;
        private RadDateTimeEditorElement radDateTimeEditorElement;
        private RadTextBoxControlElement radTextBoxElement;
     
        protected override void CreateChildElements()
        {
            base.CreateChildElements();
            stack = new CustomStackLayoutElement();
            stack.StretchHorizontally = true;
            stack.Orientation = Orientation.Horizontal;
            radDropDownListElement = new RadDropDownListElement();
            radDropDownListElement.DropDownStyle = Telerik.WinControls.RadDropDownStyle.DropDownList;
            radDropDownListElement.StretchHorizontally = true;
            radDateTimeEditorElement = new RadDateTimeEditorElement();
            radDateTimeEditorElement.StretchHorizontally = true;
            radTextBoxElement = new RadTextBoxControlElement();
            radTextBoxElement.StretchHorizontally = true;
            stack.Children.Add(radDropDownListElement);
            stack.Children.Add(radDateTimeEditorElement);
            stack.Children.Add(radTextBoxElement);
            this.Children.Add(stack);
        }
     
        protected override void SetContentCore(object value)
        {
            this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
            this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
            this.radDateTimeEditorElement.Visibility = Telerik.WinControls.ElementVisibility.Collapsed;
     
            this.DrawText = false;
            if (this.RowIndex % 3 == 0)
            {
                this.radDropDownListElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                this.radDropDownListElement.Text = this.Value + "";
            }
            else if (this.RowIndex % 3 == 1)
            {
                this.radTextBoxElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
                this.radTextBoxElement.Text = this.Value + "";
            }
            else
            {
                this.radDateTimeEditorElement.Visibility = Telerik.WinControls.ElementVisibility.Visible;
            }
     
            base.SetContentCore(value);
        }
    }
     
    public class CustomDataColumn : GridViewDataColumn
    {
        public CustomDataColumn(string fieldName) : base(fieldName)
        {
        }
     
        public override Type GetCellType(GridViewRowInfo row)
        {
            if (row is GridViewDataRowInfo)
            {
                return typeof(PNUDFCellElement);
            }
            return base.GetCellType(row);
        }
    }

    I hope this will help. Let me know if you have other questions.

    Regards,
    Hristo
    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.
  25. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 03 Oct 2018 in reply to Hristo Link to this post

    Thank you Hristo!

    I greatly appreciate your feedback on this issue. If you have any feedback related to the additional grey scrollbar (or maybe that is also related to the custom element hierarchy?)

    I will try and implement the workaround in the meantime.

    Appreciatively,

    Braden

  26. Answer
    Hristo
    Admin
    Hristo avatar
    1519 posts

    Posted 03 Oct 2018 Link to this post

    Hello Braden,

    I am not able to observe the grey scrollbar in my test project using the custom column and cell from my previous snippet. I have attached a screenshot for reference. In case the scrollbar issue persists, please try and isolate it in a runnable sample and post your code snippet here.

    Regards,
    Hristo
    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.
  27. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 03 Oct 2018 in reply to Hristo Link to this post

    I will try and implement the CustomStackLayoutElement implementation and see if that eliminates the additional scrollbar.

    Thanks again,

    Braden

  28. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 08 Oct 2018 in reply to Hristo Link to this post

    When I am trying to create the CustomStackLayoutElement class, I am getting some errors on the methods I am trying to override.

    Here is the error: 'CustomStackLayoutElement.ArrangeItemsHorizontaly(RectangleF, SizeF, float, float)': no suitable method found to override.

    This same error is happening for ArrangeHorizontally method. 

    Here is my current code, please let me know what I am doing wrong! Thanks

    using System;
    using System.Collections.Generic;
    using System.Drawing;
    using System.Linq;
    using System.Text;
    using System.Threading.Tasks;
    using Telerik.WinControls;
    using Telerik.WinControls.UI;
    using Telerik.WinForms.Documents.Model;
     
    namespace Legacymfg.Komodo.PN
    {
        public class CustomStackLayoutElement : StackLayoutElement
        {
            protected override void ArrangeHorizontally(SizeF finalSize)
            {
                Telerik.WinForms.Documents.Model.RectangleF clientRect = this.GetClientRectangle(finalSize);
                float stretchableWidth = 0;
                int stretchableCount = 0;
     
                int nonStretchableItems = 0;
     
                foreach (RadElement element in this.Children)
                {
                    if (element.Visibility == ElementVisibility.Collapsed)
                    {
                        continue;
                    }
     
     
                    if (element.StretchHorizontally)
                    {
                        stretchableCount++;
                    }
                    else
                    {
                        stretchableWidth += element.DesiredSize.Width;
                        nonStretchableItems++;
                    }
                }
     
                if (nonStretchableItems > 0)
                {
                    stretchableWidth += ElementSpacing * (nonStretchableItems - 1);
                }
     
                int spacing = this.ElementSpacing;
     
                if (stretchableCount > 0)
                {
                    stretchableWidth = (clientRect.Width - stretchableWidth) / stretchableCount;
                    stretchableWidth -= spacing * stretchableCount;
                }
     
                ArrangeItemsHorizontaly(clientRect, finalSize, stretchableWidth, spacing);
            }
     
            protected override void ArrangeItemsHorizontaly(Telerik.WinForms.Documents.Model.RectangleF clientRect, Telerik.WinForms.Documents.Model.SizeF finalSize, float stretchableWidth, float spacing)
            {
                float x = clientRect.X;
                float y = clientRect.Y;
     
                List<RadElement> children = new List<RadElement>(this.Children);
     
                if (this.Comparer != null)
                {
                    children.Sort(this.Comparer);
                }
     
                for (int i = 0; i < children.Count; i++)
                {
                    RadElement element = null;
     
                    if (this.RightToLeft && this.RightToLeftMode == RightToLeftModes.ReverseItems)
                    {
                        element = children[children.Count - i - 1];
                    }
                    else
                    {
                        element = children[i];
                    }
     
                    if (element.Visibility == ElementVisibility.Collapsed)
                    {
                        continue;
                    }
     
                    Telerik.WinForms.Documents.Model.RectangleF proposedRect = new RectangleF(x, y, stretchableWidth, clientRect.Height);
                    RectangleF finalRect = AlignRect(element, proposedRect);
     
                    if (this.RightToLeft && this.RightToLeftMode == RightToLeftModes.ReverseOffset)
                    {
                        finalRect.X = finalSize.Width - x - finalRect.Width;
                    }
     
                    this.ArrangeElement(element, clientRect, finalRect, finalSize);
     
                    x += finalRect.Width + spacing;
                }
            }
        }
     
    }
  29. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 08 Oct 2018 in reply to Braden Link to this post

    I was using the telerik SizeF and RectangleF not the System.Drawing.Class that I needed to be. Will let you know if I have any other problems.

    Thanks

  30. Braden
    Braden avatar
    37 posts
    Member since:
    Aug 2018

    Posted 08 Oct 2018 Link to this post

    I have fixed the data column so it looks like I want it! I am still having trouble getting rid of this gray scroll bar though....

    Here is a picture of my form now. Let me know if you can provide any additional insight as I need to figure this issue out!

    Thanks,

    Braden

Back to Top