Cannot add rows when I have a group header

[SEAN]

If I use ClientGroupHeaderTemplate with a group in the grid with Ajax binding and InCell editing then adding rows no longer works. When I click the Add button the new row is not visible at the top of the grid as usual.

[Rosen]

Hello Sean,

Could you please download the Q2 2011 SP1 release and see if there is a change in the described behavior. 

Regards,
Rosen
the Telerik team

[SEAN]

Hi Rosen,

That does not fix it. I'm seeing this error in the Javascript

Cannot read property 'Name' of null

Name is my grouping column. This only happens when I have a ClientGroupHeaderTemplate, if I remove that then the insert works fine with the grouping.

Sean

[Rosen]

Hi Sean,

Could you please provide (using the Format Code button) the grid's declaration?

All the best,
Rosen
the Telerik team

[SEAN]

This is the code that gives the error when I try to insert a row:

@(Html.Telerik().Grid<Sean.Projects.ViewModels.GroupedReqEntry>()
        .Name("ReqsGrid")
        .ToolBar(commands =>
        {
            commands.Insert();
            commands.SubmitChanges();
        })
        .DataKeys(keys =>
        {
            keys.Add(r => r.Id);
        })
        .Columns(columns =>
        {
            columns.Bound(r => r.Name)
                .Title("Req Name")
                .Width(200);
            columns.Bound(r => r.Description).Title("Description").Encoded(false);
            columns.Command(commands => { commands.Delete().ButtonType(GridButtonType.Image); }).Width(40);
            columns.Bound(r => r.ReqGroup.Name)
                .Hidden(true)
                .Aggregate(aggregates => aggregates.Count())
                .ClientGroupHeaderTemplate("Group: <#= Key #> (<#= Count #> reqs)");
        })
        .DataBinding(dataBinding =>
        {
            dataBinding.Ajax()
                .Select("_AjaxGroupedBinding", "Reqs")
                .Update("_AjaxGroupedBatchUpdate", "Reqs");
        })
        .Editable(editing => editing.Mode(GridEditMode.InCell))
        .Scrollable(s => s.Height(500))
        .Sortable(sorting => sorting
            .OrderBy(sortOrder => sortOrder.Add(r => r.Name)))
        .Resizable(c => c.Columns(true))
        .Reorderable(c => c.Columns(true))
        .Groupable(grouping => grouping.Groups(groups =>
        {
            groups.Add(r => r.ReqGroup.Name);
        })
            .Visible(false)
        )
        .KeyboardNavigation()
        .NoRecordsTemplate("No reqs found for this project.")
        .ClientEvents(events =>
        {
            events.OnSubmitChanges("onSubmitChanges");
            events.OnDataBinding("onDataBinding");
            events.OnEdit("onEdit");
            events.OnSave("onSave");
            events.OnLoad("onLoad");
            events.OnDataBound("onDataBound");
            events.OnRowSelect("onRowSelect");
        })
    )

This works fine for inserting a row, but now I don't have my count in the group header:

@(Html.Telerik().Grid<Sean.Projects.ViewModels.GroupedReqEntry>()
        .Name("ReqsGrid")
        .ToolBar(commands =>
        {
            commands.Insert();
            commands.SubmitChanges();
        })
        .DataKeys(keys =>
        {
            keys.Add(r => r.Id);
        })
        .Columns(columns =>
        {
            columns.Bound(r => r.Name)
                .Title("Req Name")
                .Width(200);
            columns.Bound(r => r.Description).Title("Description").Encoded(false);
            columns.Command(commands => { commands.Delete().ButtonType(GridButtonType.Image); }).Width(40);
        })
        .DataBinding(dataBinding =>
        {
            dataBinding.Ajax()
                .Select("_AjaxGroupedBinding", "Reqs")
                .Update("_AjaxGroupedBatchUpdate", "Reqs");
        })
        .Editable(editing => editing.Mode(GridEditMode.InCell))
        .Scrollable(s => s.Height(500))
        .Sortable(sorting => sorting
            .OrderBy(sortOrder => sortOrder.Add(r => r.Name)))
        .Resizable(c => c.Columns(true))
        .Reorderable(c => c.Columns(true))
        .Groupable(grouping => grouping.Groups(groups =>
        {
            groups.Add(r => r.ReqGroup.Name);
        })
            .Visible(false)
        )
        .KeyboardNavigation()
        .NoRecordsTemplate("No reqs found for this project.")
        .ClientEvents(events =>
        {
            events.OnSubmitChanges("onSubmitChanges");
            events.OnDataBinding("onDataBinding");
            events.OnEdit("onEdit");
            events.OnSave("onSave");
            events.OnLoad("onLoad");
            events.OnDataBound("onDataBound");
            events.OnRowSelect("onRowSelect");
        })
    )

Sean

[Rosen]

Hi Sean,

Although, not able to recreate this issue locally, I suspect that it may be caused by the grouping on complex object property, which when created during insertion will lack the nested object instance.  Therefore, you may use the DefaultDataItem option to set a valid default instance of the inserted object.
If you continue to experiencing difficulties please provide a small sample in which this issue can be observed locally.

Regards,
Rosen
the Telerik team

[SEAN]

That was it, thanks Rosen

I don't really have a default value but I can put a fake object in their and then it doesn't fail.

Sean