This is a migrated thread and some comments may be shown as answers.

GridView with DropDownList editor

4 Answers 1595 Views
GridView
This is a migrated thread and some comments may be shown as answers.
Chris Kirkman
Top achievements
Rank 1
Chris Kirkman asked on 01 Mar 2018, 04:36 PM

I have a GridViewTextBoxColumn in my grid.  I want it to behave like a drop down when I have more than one potential value which could be displayed.  In order to do this I capture the "EditorRequired" event.  Sometimes I will have values in my grid for a given row and sometimes I will not.  Sometimes I will have only one item in the row as well.  So basically I expect to have no value, one value or multiple values.

I'd like the column in my GridView to only show the drop down list when I have more than one value that is available.  Currently the column shows the drop down as soon as I click on that column which is very misleading to the user.  I've attached 3 screen shots showing an example of how my grid row/column appears.  In my screen shots I also show an exclamation point image when there is more than 1 item in my drop down list.

Here is my implementation of this event..

private void BatchComparisonGridEditorRequired(object sender, EditorRequiredEventArgs e)
{
    if (BatchComparisonGrid.CurrentColumn.Name == "Matches")
    {
        // get model
        ComparisonScanViewModel model = BatchComparisonGrid.CurrentRow.DataBoundItem as ComparisonScanViewModel;
 
        RadDropDownListEditor editor = new RadDropDownListEditor();
        RadDropDownListEditorElement element = editor.EditorElement as RadDropDownListEditorElement;
        element.DropDownStyle = RadDropDownStyle.DropDownList;
        element.DataSource = model.Matches;
        element.DisplayMember = "Id";               
 
        // only 0 or 1 match?
        if (model.Matches.Count <= 1)
        {
            // how to not make this a drop down??
        }
 
        // more than 1 match?  make it obvious
        if (model.Matches.Count > 1)
        {
            element.BorderThickness = new Padding(1);
            element.FocusBorderColor = Color.Blue;
            element.EnableFocusBorder = true;
        }
 
        // assign as the editor
        e.Editor = editor;
    }
}

 

Also, it would be nice for the border of the column to have a thickness and color before clicking on it when it has multiple values in the drop down.  If possible please let me know how to do this.

4 Answers, 1 is accepted

Sort by
0
Dess | Tech Support Engineer, Principal
Telerik team
answered on 05 Mar 2018, 11:06 AM
Hello, Chris, 

Thank you for writing.  

In the EditorRequired event you can control what editor to be used considering the precise row/column and the data stored in the cell. You can change the default editor by setting the EditorRequiredEventArgs.Editor property or leave the default text editor. Here is demonstrated a sample code snippet where the RadDropDownListEditor is applied for rows that have more than one option in the drop down list: 

public RadForm1()
{
    InitializeComponent();
 
    GridViewTextBoxColumn column = new GridViewTextBoxColumn("Matches");
    this.radGridView1.Columns.Add(column);
    this.radGridView1.AutoSizeColumnsMode = GridViewAutoSizeColumnsMode.Fill;
 
    this.radGridView1.EditorRequired += radGridView1_EditorRequired;
 
    for (int i = 0; i < 5; i++)
    {
        this.radGridView1.Rows.Add("Item" + i);
    }
}
 
private void radGridView1_EditorRequired(object sender, EditorRequiredEventArgs e)
{
    if (this.radGridView1.CurrentColumn.Name == "Matches")
    {
        DataTable dt = GetData(this.radGridView1.CurrentRow.Index);
 
        // only 0 or 1 match?
        if (dt.Rows.Count > 1)
        {
            // how to not make this a drop down??
            RadDropDownListEditor editor = new RadDropDownListEditor();
            RadDropDownListEditorElement element = editor.EditorElement as RadDropDownListEditorElement;
            element.DropDownStyle = RadDropDownStyle.DropDownList;
            element.DataSource = dt;
            element.DisplayMember = "Name";
            element.ValueMember = "Name";
            // assign as the editor
            e.Editor = editor;
        }
        else
        {
            //leave the default text editor
        }
    }
}
 
private DataTable GetData(int p)
{
    DataTable dt = new DataTable();
    dt.Columns.Add("Id", typeof(int));
    dt.Columns.Add("Name", typeof(string));
    if (p % 2 == 0)
    {
        for (int i = 0; i < 5; i++)
        {
            dt.Rows.Add(i, "Item" + i);
        }
    }
 
    return dt;
}

I would recommend you to have a look at the following KB article which demonstrates how you can indicate to the user what is the editor type for a certain cell: https://www.telerik.com/support/kb/winforms/gridview/details/indicate-the-editor-type-in-radgridview-columns

I hope this information helps. Should you have further questions I would be glad to help. 
 
 Regards,
Dess
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Chris Kirkman
Top achievements
Rank 1
answered on 05 Mar 2018, 12:59 PM
I understand the concept of using the default editor.  I probably wasn't clear enough.  I don't want the row/column to be editable at all under the conditions mentioned above.  I only want it to be editable (select a value from my dropdown) when there are more than 1 choices in the drop down.
0
Accepted
Dess | Tech Support Engineer, Principal
Telerik team
answered on 05 Mar 2018, 01:35 PM
Hello, Chris,   

Thank you for writing back. 
 
The provided clarification was very useful. In order to forbid entering edit mode for some cells it is necessary to cancel the CellBeginEdit event according to your custom condition. 
private void radGridView1_CellBeginEdit(object sender, GridViewCellCancelEventArgs e)
{
    if (e.Column.Name=="Matches")
    {
        DataTable dt = GetData(this.radGridView1.CurrentRow.Index);
          
        if (dt.Rows.Count > 1)
        {
            e.Cancel = false;
        }
        else
        {
            e.Cancel = true;
        }
    }
}

I hope this information helps. If you have any additional questions, please let me know. 

 Regards,
Dess
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Chris Kirkman
Top achievements
Rank 1
answered on 05 Mar 2018, 01:39 PM
I can't believe I missed such an obvious solution.  :)  I'll give that a try.  Thanks.
Tags
GridView
Asked by
Chris Kirkman
Top achievements
Rank 1
Answers by
Dess | Tech Support Engineer, Principal
Telerik team
Chris Kirkman
Top achievements
Rank 1
Share this question
or