Using an alternate EditForm than auto-generated form

[Walter]

Greetings:
    I have an aspx. page that I'm using as an EditForm for a Radgrid. The Radgrid is contained on this page as a UserControl. Therefore, I have a button on this page that I'm using to direct the appropriate commandname needed in the control's code-behind. This works fine to edit/update a record from the Radgrid. However, I can't wrap my head around getting this to work for Inserting a record. The following is my button click event that creates an error when inserting ("Index was outside the bounds of the array")

protected void SaveChanges_Click(object sender, EventArgs e)
        {
            if (Page.IsValid)
            {
                RadGrid EquipInvGrid = (this.Master.FindControl("ContentPlaceHolder1").FindControl("EquipInvListControl").FindControl("rg_EquipInvList")) as RadGrid;

                if (rtbFormMode_Hdn.Text == "Update")
                {
                    (EquipInvGrid.SelectedItems[0] as GridDataItem).FireCommandEvent(RadGrid.UpdateCommandName, string.Empty);
                }
                else
                {
                    EquipInvGrid.MasterTableView.IsItemInserted = true;
                    (EquipInvGrid.MasterTableView.GetItems(GridItemType.CommandItem)[0] as GridCommandItem).FireCommandEvent(RadGrid.PerformInsertCommandName, string.Empty);
                }
            }
            else
            {
                rnotif_Validation.Show();
            }
        }

 

Any help is much appreciated.

Walt

 

 

 

[Princy]

Hi Walter,

Make sure that you have set the property CommandItemDisplay to any values other than "None".

ASPX:

<MasterTableView CommandItemDisplay="Top">

Thanks,
Princy

[Walter]

Hi and thanks for the response. I think what you're saying is that while I'm not using the commanditem specifically on the grid, that I have to have this area available for the event to bubble up to (originating from the button click). In any event, this didn't work (I still get the 'index out of bounds' error), and plus I really don't want an 'insert new item' on  the top of the grid since it's on the 'main' form instead.

Somehow I have to let the grid know that I'm inserting a record, and to just fire the PerformInsert Command which I can't seem to figure out.

thx
Walt

[Princy]

Hi Walter,

Since you are accessing the CommandItem to perform Insert, its required to set CommandItemDisplay. One work around would be to set it and hide it. Here is a sample that i tried to make the Grid in edit and perform Insert. Provide your full code snippet if this doesn't help.

ASPX:

<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false" DataSourceID="SqlDataSource1"
    AllowPaging="true" AutoGenerateEditColumn="true" AllowSorting="true">
    <MasterTableView DataKeyNames="OrderID" CommandItemDisplay="Top">
        <Columns>
            <telerik:GridBoundColumn UniqueName="OrderID" DataField="OrderID" HeaderText="OrderID">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="ShipCity" HeaderText="ShipCity" UniqueName="ShipCity" />
        </Columns>
    </MasterTableView>
</telerik:RadGrid>
<asp:Button ID="Button1" runat="server" Text="Save" OnClick="Button1_Click" />
<asp:Button ID="Button2" runat="server" Text="Add new" OnClick="Button2_Click" />

C#:

protected void Button1_Click(object sender, EventArgs e)
{
 RadGrid grid = (this.FindControl("RadGrid1") as RadGrid);
 if (grid.MasterTableView.IsItemInserted)
 {
  (grid.MasterTableView.GetItems(GridItemType.CommandItem)[0] as GridCommandItem).FireCommandEvent(RadGrid.PerformInsertCommandName, string.Empty);
 }
 else if (grid.EditItems.Count > 0)
 {
  grid.EditItems[0].FireCommandEvent(RadGrid.UpdateCommandName, string.Empty);
 }
}
protected void Button2_Click(object sender, EventArgs e)
{
    RadGrid1.MasterTableView.IsItemInserted = true;
    RadGrid1.Rebind();
}

CSS:

<style type="text/css">
  .RadGrid_Default .rgCommandTable
    {
     display: none;
    }
</style>

Thanks,
Princy

[Viktor Tachev]

Hello Walt,

You could use buttons placed outside RadGrid to insert and update items. In order to do this you could use similar approach to the one suggested by Princy, however without the CommandItem.

OnClick event of a Button you could get the grid EditFormItems, check if an item is GridEditFormInsertItem and fire Insert command:

protected void Button1_Click(object sender, EventArgs e)
{
    RadGrid grid = (this.FindControl("RadGrid1") as RadGrid);

    if (grid.MasterTableView.IsItemInserted)
    {
        GridItem[] gridItems = grid.MasterTableView.GetItems(GridItemType.EditFormItem);

        foreach (GridItem item in gridItems)
        {
            if (item is GridEditFormInsertItem)
            {
                (item as GridEditFormInsertItem).FireCommandEvent(RadGrid.PerformInsertCommandName, string.Empty);
                break;
            }
        }
    }
    else if (grid.EditItems.Count > 0)
    {
        (grid.EditItems[0] as GridDataItem).EditFormItem.FireCommandEvent(RadGrid.UpdateCommandName, string.Empty);
    }
}

I am also attaching a sample project as reference. Give this approach a try and you should achieve the behavior you are looking for.

Regards,
Viktor Tachev
Telerik

[Walter]

Hi again Princy - that's basically what I've got to a 'T' (except for adding the aforementioned CommandItemDisplay which I did include). And the small difference of how I go into it differently depending on whether Insert or Update. Your 'button2' is essentially the same as the following rbtnAddNew.

protected void rbtnAddNew_Click(object sender, EventArgs e)
        {
            ClearEquipForm();

            RadGrid EquipInvGrid = (this.Master.FindControl("ContentPlaceHolder1").FindControl("EquipInvListControl").FindControl("rg_EquipInvList")) as RadGrid;
            //need to get grid in insertmode here
            EquipInvGrid.MasterTableView.IsItemInserted = true;
            EquipInvGrid.Rebind();
        }

My protected void SaveChanges_Click is essentially the same as your protected void Button1_Click (just a different method of discerning modes).

Briefly the grid looks like:

<telerik:RadGrid ID="rg_EquipInvList" runat="server" AllowPaging="True" CellSpacing="0" OnItemCommand="rg_EquipInvList_ItemCommand"
    GridLines="Horizontal" PageSize="30" Height="555px" AllowSorting="True" OnSelectedIndexChanged="rg_EquipInvList_SelectedIndexChanged"
    MasterTableView-AllowSorting="True" OnUpdateCommand="rg_EquipInvList_UpdateCommand"
    EnableHeaderContextMenu="True" MasterTableView-TableLayout="Auto" OnInsertCommand="rg_EquipInvList_InsertCommand" ClientSettings-Resizing-AllowColumnResize="false">
    <ClientSettings EnablePostBackOnRowClick="true">
        <Selecting AllowRowSelect="true" />
        <Scrolling AllowScroll="True" UseStaticHeaders="True" />
        <Resizing AllowColumnResize="false" />
    </ClientSettings>
    <MasterTableView AutoGenerateColumns="False" DataKeyNames="UnitID" DataSourceID="SqlDS_EquipInvGrid" EditMode="EditForms"
         CommandItemDisplay="Top">
        <CommandItemSettings ExportToPdfText="Export to PDF" />
        <RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">
            <HeaderStyle Width="20px" />
        </RowIndicatorColumn>
<Columns>
            <telerik:GridBoundColumn DataField="UnitID" FilterControlAltText="Filter UnitID column" HeaderText="Unit ID" SortExpression="UnitID" UniqueName="UnitID" Resizable="False" EmptyDataText=" ">
                <ColumnValidationSettings>
                    <ModelErrorMessage Text="" />
                </ColumnValidationSettings>
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="CatID" FilterControlAltText="Filter CatID column" HeaderText="CatID" SortExpression="CatID" UniqueName="CatID"
                Display="false">
                <ColumnValidationSettings>
                    <ModelErrorMessage Text="" />
                </ColumnValidationSettings>
            </telerik:GridBoundColumn>
</Columns>

        <EditFormSettings>
            <EditColumn FilterControlAltText="Filter EditCommandColumn column">
            </EditColumn>
        </EditFormSettings>
        <PagerStyle PageSizeControlType="RadComboBox" />
    </MasterTableView>
    <PagerStyle PageSizeControlType="RadComboBox" />
    <FilterMenu EnableImageSprites="False">
    </FilterMenu>
</telerik:RadGrid>

Unfortunately, I'm still getting a 'Index is outside the bounds of the arrray' error. So I'm not sure if the above helps any, but thanks for your efforts.

I may just transpose the entire block of code from my usercontrol insert command to the SaveChanges_Click event of the 'parent' page.

Walt

[Walter]

Hi Viktor:
    In my instance with the grid being a usercontrol and mainpage being essentially the edit form, the 'GridItem item in gridItems' is empty unless I have a method of filling this. I looked at your attached example as well, but couldn't see how that was done. Perhaps I'm missing something.

thx
Walt 

[Viktor Tachev]

Hello Walt,

Thank you for writing back.

The gridItems collection from my previous example contains all items that are EditFormItem. The collection is returned by the GetItems() method.

From the markup you provided for RadGrid it seems that you are using the grid's default EditForm settings. I am not quite sure what you mean by that the main page being the edit form. Would you elaborate more on the scenario you have?

I have prepared another project that illustrates how the insert command could be fired from the server and from the client. Give the attached project a try and let me know if it is working for you.

Would you also let me know what changes are required to the sample so it resembles a simplified version of your scenario? This would allow us to have better understanding of your case.


Regards,
Viktor Tachev
Telerik

[Walter]

Hi Viktor:
My scenario was basically modelled after an example on the Telerik demo site for the 2013 Q2 version (with something to the effect of 'Using an  alternate edit form'). It's basically the opposite of other examples you have whereby the edit form is a usercontrol.  Attached is a screen shot if that helps visualize what I'm trying to do (this screen is the alternate edit form; grid below 'Search Results' is grid as UserControl). I had everything working several months ago, except for 'Insert', which I've now returned to.

That Q2 example had a similar line of code on insert:
That example was NOT using a built in edit form either (sorry, I missed copying a portion in my code below as I'm not using EditForms).

if (rtbFormMode_Hdn.Text == "Update")

{
(EquipInvGrid.SelectedItems[0] as GridDataItem).FireCommandEvent(RadGrid.UpdateCommandName,string.Empty);

}

else

{

EquipInvGrid.MasterTableView.IsItemInserted = true;

(EquipInvGrid.MasterTableView.GetItems(GridItemType.CommandItem)[0] as GridCommandItem).FireCommandEvent(RadGrid.PerformInsertCommandName, string.Empty);

}

So basically, from my understanding, in the last line of code above, any method referencing any EditFormItems will not work (up to 'FireCommandEvent). I'd need an alternate method of firing this command when not using EditForms.

Thanks for your patience (I'm new to asp),
Walt

[Viktor Tachev]

Hello Walt,

I found the demo you are referring to where the grid control is using an external edit form. I have prepared a sample project based on the demo where update and insert works as expected on my end. I am attaching the sample to this post.

To open the external EditForm you need to press a button below the grid. In the ItemCommand event handler the default command is canceled in order to open the form for insert or update.

Regards,
Viktor Tachev
Telerik