Get controls in FormTemplate with Button event

[Allan]

Hi,

I have a radgrid with custom FormTemplate and in this template I have a RadButton and a Radtextbox.

I want do click on RadButton and insert some text in RadTextbox.

How can I do it?

Thanks!

<telerik:RadGrid ID="RadGrid1" runat="server" DataSourceID="SqlDataSource1"
    AllowAutomaticInserts="True" CellSpacing="0" GridLines="None" Skin="Black"
    style="height: 44px">
    <MasterTableView autogeneratecolumns="False" datasourceid="SqlDataSource1"
        CommandItemDisplay="Top" DataKeyNames="idExterno" EditMode="PopUp">
        <CommandItemSettings ExportToPdfText="Export to PDF">
        </CommandItemSettings>
        <RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">
            <HeaderStyle Width="20px"></HeaderStyle>
        </RowIndicatorColumn>
        <ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column">
            <HeaderStyle Width="20px"></HeaderStyle>
        </ExpandCollapseColumn>
        <Columns>
            <telerik:GridBoundColumn DataField="idExterno"
                FilterControlAltText="Filter idExterno column" HeaderText="idExterno"
                SortExpression="idExterno" UniqueName="idExterno" DataType="System.Int32"
                ReadOnly="True">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Model" FilterControlAltText="Filter Model column"
                HeaderText="Model" SortExpression="Model" UniqueName="Model">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="indice"
                FilterControlAltText="Filter indice column" HeaderText="indice"
                SortExpression="indice" UniqueName="indice" DataType="System.Int32">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Height"
                FilterControlAltText="Filter Height column" HeaderText="Height"
                SortExpression="Height" UniqueName="Height">
            </telerik:GridBoundColumn>
        </Columns>
        <EditFormSettings InsertCaption="Add new Item" EditFormType="Template">
            <EditColumn FilterControlAltText="Filter EditCommandColumn column"></EditColumn>
            <FormTemplate>
                <telerik:RadButton ID="RadButton2" runat="server" onclick="RadButton2_Click"
                    Skin="Forest" Text="RadButton">
                </telerik:RadButton>
                <br />
                <telerik:RadTextBox ID="RadTextBox1" Runat="server" Skin="Web20">
                </telerik:RadTextBox>
            </FormTemplate>
        </EditFormSettings>
    </MasterTableView>
    <FilterMenu EnableImageSprites="False"></FilterMenu>
    <HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default"></HeaderContextMenu>
</telerik:RadGrid>

[Shinu]

Hello Allan,

Try the following code snippet.
C#:

protected void RadButton1_Click(object sender, EventArgs e)
{
  RadButton btn = (RadButton)sender;
  GridEditableItem item = (GridEditableItem)btn.NamingContainer;
 RadTextBox txt = (RadTextBox)item.FindControl("RadTextBox1");
}

-Shinu.

[Allan]

Thanks, it works perfectly!

[Doug]

Did you mean protected void RadButton2_Click?
Is the trick to this insuring the buttons are radButtons? I tried this with ASP:Button and cannot handle the event on the server.

[Shinu]

Hello Doug,

I cannot reproduce the issue at my end. Here is the sample code that I tried to access the RadTextBox in a Button click event.
aspx:

<EditFormSettings EditFormType="Template">
   <FormTemplate>
      <asp:Button ID="Button3" runat="server" Text="test" onclick="Button3_Click" />
      <telerik:RadTextBox ID="RadTextBox1" runat="server"></telerik:RadTextBox>
   </FormTemplate>
</EditFormSettings>

C#:

protected void Button3_Click(object sender, EventArgs e)
{
   Button btn = (Button)sender;
   GridEditableItem item = (GridEditableItem)btn.NamingContainer;
   RadTextBox txt = (RadTextBox)item.FindControl("RadTextBox1");
}

Thanks,
Shinu.

[Doug]

Yes, that works for when the template is used by the GridEditCommandColumn, but if the templarte is used by the command buttons of the header - in particular then Add new Record button - then the events are not handled.
What I mean is I have these snips from my ascx markup:

<telerik:RadGrid ID="CollectionsEditorGrid" runat="server" GridLines="None" AllowPaging="true"
            AllowSorting="True" AutoGenerateColumns="False" ShowStatusBar="true" CssClass="RadGrid">
            <MasterTableView Width="100%" CommandItemDisplay="Top" DataKeyNames="ObjectTypeID">

  <Columns>
                    <telerik:GridEditCommandColumn UniqueName="EditCommandColumn" ></telerik:GridEditCommandColumn>
                    <telerik:GridBoundColumn UniqueName="CollectionID" HeaderText="ID" DataField="ObjectTypeID" ></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn UniqueName="Name" HeaderText="Collection Name" DataField="CollectionName"></telerik:GridBoundColumn>
                    <telerik:GridButtonColumn UniqueName="DeleteColumn" Text="Delete" CommandName="Delete" />
                </Columns>
                <EditFormSettings EditFormType="Template">
                    <FormTemplate>
                        <table id="Table2" cellspacing="2" cellpadding="1" width="100%" border="0" rules="none"
                            style="border-collapse: collapse; background: white;">
                            <tr class="EditFormHeader">
                                <td colspan="2" style="font-size: small">
                                    <b>Collection Editor</b>
                                </td>
                            </tr>
                            <tr>
                                <td style="width:30%;">
                                    Collection Name:
                                </td>
                                <td>
                                    <asp:TextBox ID="tbCollection" runat="server" Text='<%# Bind("CollectionName") %>'></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td align="left" colspan="2">
                                    <telerik:RadButton ID="btnUpdate" Text='<%# IIf((TypeOf(Container) is GridEditFormInsertItem), "Insert", "Update") %>'
                                    runat="server" CommandName='<%# IIf((TypeOf(Container) is GridEditFormInsertItem), "Insert", "Update")%>' OnClick="btnUpdate_Click">
                                    </telerik:RadButton>&nbsp;
                                     <telerik:RadButton  ID="btnCancel" Text="Cancel" runat="server" CausesValidation="False"
                                     CommandName="Cancel"></telerik:RadButton >
                                </td>
                            </tr>

                        </table>
                    </FormTemplate>

and my server-side code:
        Protected Sub btnUpdate_Click(sender As Object, e As EventArgs)
        ' Just a test. Break point halts for Update, but not Insert
        End Sub

Note the templete draws on the browser for both add and update, with the appropriate text changes to the button, but the click is not handled for the "insert" click.

[Shinu]

Hello Doug,

Here is the sample code that I tried which worked as expected.
aspx:

<EditFormSettings EditFormType="Template" >
  <FormTemplate>
      <telerik:RadButton ID="btnUpdate" Text='<%# (Container is GridEditFormInsertItem) ? "Insert" : "Update" %>' runat="server" CommandName='<%# (Container is GridEditFormInsertItem) ? "PerformInsert" : "Update" %>' onclick="btnUpdate_Click">
      </telerik:RadButton>
      <telerik:RadButton  ID="btnCancel" Text="Cancel" runat="server" CausesValidation="False" CommandName="Cancel"></telerik:RadButton >
  </FormTemplate>
</EditFormSettings>

Thanks,
Shinu.

[Doug]

Thank you, but I do not see what caused the template (you provided) to be used. My question is:How do I get the template instance that is caused by the ADD button to raise events such as those expected from the buttons in the template.

I already agree that the templates buttons DO raise event when the template is caused by the edit button (as implied through the GridEditCommandColumn). However, that same template - with the same buttons - do not seem to raise events when the templet is formed by an  insert.

My solution has been to not use the command buttons but provide my own "add a record" button so I can control the events in a predictable manner. I would like to use RadGrid more fully, but it keeps getting in the way.

[Casey]

Hi Doug,

When the Add New Record button is clicked, the RadGrid's ItemCommand event is fired with a CommandName of "InitInsert". 

protected void RadGrid1_ItemCommand(object sender, GridCommandEventArgs e)
{
        if (e.CommandName == "InitInsert")
        {
            //This is the event fired by the Add New Record button
        }
}

If you are trying to accomplish something specific on the click of Add New Record, please elaborate, and I'll try to be of assistance.

I hope this helps!
Casey

[Doug]

Thanks Casey,
I think the event you pointed out is for when the Insert is initiated. That is before the user has had an opportunity to add values to the template controls. I want to trap the "save this record" button click (btnAdd_Clicked) but the event is not raised. I want to figure out why it is not raised.

Are you saying I need to programatically Add Handler between the template button and the server code at this point?

[Casey]

Instead of using the OnClick event of the button, why not just handle the Insert/Update in the RadGrid's item command event? You could verify that your button has the correct command when inserting/updating. Check e.CommandName when btnUpdate is clicked when the RadGrid's template is being displayed from the edit button's click, and from the Add New Record button's click.

<telerik:RadGrid ID="CollectionsEditorGrid" runat="server" GridLines="None" AllowPaging="true"
            AllowSorting="True" AutoGenerateColumns="False" ShowStatusBar="true" CssClass="RadGrid"
            OnItemCommand="CollectionsEditorGrid_ItemCommand">
            <MasterTableView Width="100%" CommandItemDisplay="Top" DataKeyNames="ObjectTypeID">
  <Columns>
                    <telerik:GridEditCommandColumn UniqueName="EditCommandColumn" ></telerik:GridEditCommandColumn>
                    <telerik:GridBoundColumn UniqueName="CollectionID" HeaderText="ID" DataField="ObjectTypeID" ></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn UniqueName="Name" HeaderText="Collection Name" DataField="CollectionName"></telerik:GridBoundColumn>
                    <telerik:GridButtonColumn UniqueName="DeleteColumn" Text="Delete" CommandName="Delete" />
                </Columns>
                <EditFormSettings EditFormType="Template">
                    <FormTemplate>
                        <table id="Table2" cellspacing="2" cellpadding="1" width="100%" border="0" rules="none"
                            style="border-collapse: collapse; background: white;">
                            <tr class="EditFormHeader">
                                <td colspan="2" style="font-size: small">
                                    <b>Collection Editor</b>
                                </td>
                            </tr>
                            <tr>
                                <td style="width:30%;">
                                    Collection Name:
                                </td>
                                <td>
                                    <asp:TextBox ID="tbCollection" runat="server" Text='<%# Bind("CollectionName") %>'></asp:TextBox>
                                </td>
                            </tr>
                            <tr>
                                <td align="left" colspan="2">
                                    <telerik:RadButton ID="btnUpdate" Text='<%# IIf((TypeOf(Container) is GridEditFormInsertItem), "Insert", "Update") %>'
                                    runat="server" CommandName='<%# IIf((TypeOf(Container) is GridEditFormInsertItem), "PerformInsert", "Update")%>' >
                                    </telerik:RadButton>
                                     <telerik:RadButton  ID="btnCancel" Text="Cancel" runat="server" CausesValidation="False"
                                     CommandName="Cancel"></telerik:RadButton >
                                </td>
                            </tr>
                        </table>
                    </FormTemplate>

Protected Sub CollectionsEditorGrid_ItemCommand(sender As Object, e As GridCommandEventArgs)
        ' check e.CommandName when the button in question is clicked, it should be PerformInsert when the
        ' CollectionsEditorGrid.MasterTableView.IsItemInserted property is True and Update when the value is False
        End Sub