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

Problem with editable grid created at runtime

3 Answers 108 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Herman Gouw
Top achievements
Rank 1
Herman Gouw asked on 30 Jul 2009, 02:45 PM
Hi,

I have a grid with 4 columns:
Column 1 - an editable GridDateTimeColumn which displays and accepts a date
Column 2 - an editable GridNumericColumn which displays and accepts an integer
Column 3 - an editable GridBoundColumn which displays and accepts a string
Column 4 - a GridEditCommandColumn

The grid is created at runtime (instead of at design time).

I get the following error message:
"Editor cannot be initialized for column: Date"
when I exit from the edit mode by either clicking Update or Cancel button on the GridEditCommandColumn.

Can you please show me what I have missed or done wrong in my code?

The web page is available on http://www.gouw.ws/RadGrid/DynamicGrid.aspx

The source code is given below:

ASPX:
=====
<form id="form1" runat="server">
<div>
    <telerik:RadScriptManager ID="radScriptManager" runat="server" />
    <telerik:RadGrid ID="radGrid" AutoGenerateColumns="false" GridLines="Vertical" OnNeedDataSource="radGrid_NeedDataSource" OnUpdateCommand="radGrid_UpdateCommand" runat="server">
        <ClientSettings>
            <Scrolling UseStaticHeaders="true" />
        </ClientSettings>
        <MasterTableView EditMode="InPlace" TableLayout="Fixed">
        </MasterTableView>
    </telerik:RadGrid>
</div>
</form>

C#:
===
public partial class DynamicGrid : System.Web.UI.Page
{
    private List<Data> _data = null;

    protected void Page_Load(object sender, EventArgs e)
    {
        BuildGrid();

        if (!IsPostBack)
        {
            this._data = Data.Load();
            Session["DATA"] = this._data;
        }
        else
        {
            this._data = (List<Data>)Session["DATA"];
        }
    }

    protected void radGrid_NeedDataSource(object source, GridNeedDataSourceEventArgs e)
    {
        this.radGrid.DataSource = this._data;
    }

    protected void radGrid_UpdateCommand(object sender, GridCommandEventArgs e)
    {
        if (e.Item is GridEditableItem && e.Item.IsInEditMode)
        {
            GridEditableItem item = e.Item as GridEditableItem;
            ((Data)(this._data[item.ItemIndex])).Date = (item["Date"].Controls[0] as RadDatePicker).SelectedDate.Value.Date;
            ((Data)(this._data[item.ItemIndex])).Value = int.Parse((item["Value"].Controls[0] as RadNumericTextBox).Text);
            ((Data)(this._data[item.ItemIndex])).Description = (item["Description"].Controls[0] as TextBox).Text;
        }
    }

    private void BuildGrid()
    {
        this.radGrid.Columns.Clear();

        GridDateTimeColumn dateColumn = new GridDateTimeColumn();
        dateColumn.DataField = "Date";
        dateColumn.HeaderText = "Date";
        dateColumn.UniqueName = "Date";
        this.radGrid.Columns.Add(dateColumn);
        this.radGrid.MasterTableView.Columns[0].HeaderStyle.Width = Unit.Percentage(13);
        this.radGrid.MasterTableView.Columns[0].ItemStyle.HorizontalAlign = HorizontalAlign.Left;

        GridNumericColumn valueColumn = new GridNumericColumn();
        valueColumn.DataField = "Value";
        valueColumn.HeaderText = "Value";
        valueColumn.UniqueName = "Value";
        this.radGrid.Columns.Add(valueColumn);
        this.radGrid.MasterTableView.Columns[1].HeaderStyle.Width = Unit.Percentage(13);
        this.radGrid.MasterTableView.Columns[1].ItemStyle.HorizontalAlign = HorizontalAlign.Left;

        GridBoundColumn descriptionColumn = new GridBoundColumn();
        descriptionColumn.DataField = "Description";
        descriptionColumn.HeaderText = "Description";
        descriptionColumn.UniqueName = "Description";
        this.radGrid.Columns.Add(descriptionColumn);
        this.radGrid.MasterTableView.Columns[2].HeaderStyle.Width = Unit.Percentage(64);
        this.radGrid.MasterTableView.Columns[2].ItemStyle.HorizontalAlign = HorizontalAlign.Left;

        GridEditCommandColumn editColumn = new GridEditCommandColumn();
        editColumn.ButtonType = GridButtonColumnType.LinkButton;
        editColumn.UniqueName = "Edit";
        this.radGrid.Columns.Add(editColumn);   
    }
}

public class Data
{
    public DateTime Date { get; set; }
    public int Value { get; set; }
    public string Description { get; set; }

    public Data(DateTime date, int value, string description)
    {
        Date = date;
        Value = value;
        Description = description;
    }

    public static List<Data> Load()
    {
        List<Data> data = new List<Data>();
        data.Add(new Data(DateTime.Now, 1, "This date is today"));
        data.Add(new Data(DateTime.Now.AddDays(1), 2, "This date is tomorrow"));
        data.Add(new Data(DateTime.Now.AddDays(2), 3, "This date is the day after tomorrow"));
        return data;
    }
}

Thanks & regards,
Herman Gouw
Skype: hermangouw

3 Answers, 1 is accepted

Sort by
0
Yavor
Telerik team
answered on 05 Aug 2009, 07:35 AM
Hi Herman,

I reviewed the code posted, and noticed that you are not properly creating the control structure.
To see more information on the matter, please refer to the following topic:

http://www.telerik.com/help/aspnet-ajax/grdprogrammaticcreation.html

I hope it gets you started properly.

Greetings,
Yavor
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Herman Gouw
Top achievements
Rank 1
answered on 05 Aug 2009, 02:51 PM
Hi Yavor,

Thank you for your reply.

 I have read the topic that you gave me and modified the web page accordingly using ItemTemplate/EditItemTemplate of GridTemplateColumn.

For simplicity, the new grid has 2 columns only:
Column 1 - an editable GridTemplateColumn which displays and accepts a string
Column 2 - a GridEditCommandColumn

I got the following runtime error message
Specified argument was out of the range of valid values.
Parameter name: index
when I clicked the Update on the GridEditCommandColumn.

Can you please show me how to extract the new description in radGrid_UpdateCommand?

The new source code is given below:

1. The code behind (BuildGrid and radGrid_UpdateCommand)

private void BuildGrid() 
    this.radGrid.Columns.Clear(); 
 
    GridTemplateColumn description = new GridTemplateColumn(); 
    description.DataField = "Description"
    description.HeaderText = "Description"
    description.UniqueName = "Description"
    description.ItemTemplate = new ItemTemplate("Description"); 
    description.EditItemTemplate = new EditTemplate("Description"); 
    this.radGrid.Columns.Add(description); 
 
    GridEditCommandColumn columnEdit = new GridEditCommandColumn(); 
    columnEdit.ButtonType = GridButtonColumnType.LinkButton; 
    columnEdit.UniqueName = "Edit"
    this.radGrid.Columns.Add(columnEdit);        
 
protected void radGrid_UpdateCommand(object sender, GridCommandEventArgs e) 
    if (e.Item is GridEditableItem && e.Item.IsInEditMode) 
    { 
        GridEditableItem item = e.Item as GridEditableItem; 
        ((Data)(this._data[item.ItemIndex])).Description = (item["Description"].Controls[0] as TextBox).Text; 
    } 

2. The template controls (ItemTemplate and EditTemplate):

public class ItemTemplate : ITemplate 
    protected string Name { getset; } 
 
    public ItemTemplate(string name) 
    { 
        Name = name; 
    } 
 
    public void InstantiateIn(Control container) 
    { 
        Label label = new Label(); 
        label.ID = Name; 
        label.DataBinding += new EventHandler(ItemTemplate_DataBinding); 
        container.Controls.Add(label); 
    } 
 
    protected void ItemTemplate_DataBinding(object sender, EventArgs e) 
    { 
        Label label = (Label)sender; 
        GridDataItem container = (GridDataItem)label.NamingContainer; 
        label.ID = Name; 
        label.Text = ((Web.Apps.RadGrid.Data)container.DataItem).Description.ToString(); 
    } 
 
public class EditTemplate : IBindableTemplate, ITemplate 
    protected string Name { getset; } 
 
    public EditTemplate(string name) 
    { 
        Name = name; 
    } 
 
    public void InstantiateIn(Control container) 
    { 
        RadTextBox radTextBox = new RadTextBox(); 
        radTextBox.ID = Name; 
        radTextBox.Width = Unit.Percentage(100); 
        radTextBox.DataBinding += new EventHandler(EditTemplate_DataBinding); 
        container.Controls.Add(radTextBox); 
    } 
 
    public IOrderedDictionary ExtractValues(Control container) 
    { 
        OrderedDictionary orderedDictionary = new OrderedDictionary(); 
        orderedDictionary.Add(Name, ((GridTableCell)container.Controls[0]).Text); 
        return orderedDictionary; 
    } 
 
    public void EditTemplate_DataBinding(object sender, EventArgs e) 
    { 
        RadTextBox radTextBox = (RadTextBox)sender; 
        GridEditableItem container = (GridEditableItem)radTextBox.NamingContainer; 
        radTextBox.ID = Name; 
        radTextBox.Text = ((Web.Apps.RadGrid.Data)container.DataItem).Description.ToString(); 
        radTextBox.Width = Unit.Percentage(100); 
    } 

Thanks & regards,
Herman Gouw
Skype: hermangouw

0
Yavor
Telerik team
answered on 10 Aug 2009, 08:05 AM
Hello Herman,

At this point, in order to properly pinpoint the issue at hand, it will be best if you open a formal support ticket, and send us a small working project, demonstrating your logic, and showing the unwanted behavior. I will debug it locally, and get back to you with more information.

Kind regards,
Yavor
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
Tags
General Discussions
Asked by
Herman Gouw
Top achievements
Rank 1
Answers by
Yavor
Telerik team
Herman Gouw
Top achievements
Rank 1
Share this question
or