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

How to add a Custom Button to the CommandItem of my RadGrid control and enable it to postback its click event?

7 Answers 873 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Pooya
Top achievements
Rank 1
Pooya asked on 26 Jul 2011, 02:41 PM
How to add a Custom Button to the CommandItem TableRow of my RadGrid control which is inside an updatepanel and enable it to have a Click event and full postback?

Thanks,

7 Answers, 1 is accepted

Sort by
0
Pooya
Top achievements
Rank 1
answered on 27 Jul 2011, 10:08 AM
I fixed it:

 this.RadGrid.MasterTableView.Init += MasterTableViewInit;

 void MasterTableViewInit(object sender, EventArgs e)
        {
            if (!this.EnablePdfExport) return;


            var commandItem = this.RadGrid.MasterTableView.GetItems(GridItemType.CommandItem).SingleOrDefault();


            if (commandItem == null) return;


            AddPdfButton(commandItem as GridCommandItem);
        } 
0
Pooya
Top achievements
Rank 1
answered on 19 Aug 2011, 11:04 AM
That's not the right event apparently.

I added it on MasterTableView.Load and it appears correctly on page refreshes, etc. However, the button disappears when sorting is enabled and a column is selected to be sorted. why sorting makes it disappear? how to fix it?

I also tried adding it in the RadGrid.ItemCreated event. The problem is that the click event of my button is never raised in this case.

Still it's not resolved properly.
0
Vasil
Telerik team
answered on 24 Aug 2011, 09:29 AM
Hi Pooya,

Here is an example how to place a button inside the command item that to make a full postback when the grid is in update panel.

<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
</telerik:RadScriptManager>
<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
  <script type="text/javascript">
    function RequestStart(sender, eventArgs)
    {
      var eventTarget = eventArgs.get_eventTarget();
      if (eventTarget.indexOf("Button1") != -1)
      {
        eventArgs.set_enableAjax(false);
      }
    }
  </script>
</telerik:RadCodeBlock>
<div>
  <telerik:RadAjaxPanel runat="server" ClientEvents-OnRequestStart="RequestStart">
    <telerik:RadGrid ID="RadGrid1" runat="server" AllowSorting="true" OnNeedDataSource="RadGrid1_NeedDataSource">
      <MasterTableView CommandItemDisplay="Top">
        <CommandItemTemplate>
          <asp:Button ID="Button1" Text="Add new item" runat="server" OnClick="ButtonClicked">
          </asp:Button>
        </CommandItemTemplate>
      </MasterTableView>
    </telerik:RadGrid>
  </telerik:RadAjaxPanel>
</div>

C#:
protected void RadGrid1_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
{
    RadGrid1.DataSource = new int[] { 1, 2, 3, 4, 5 };
}
 
protected void ButtonClicked(object sender, EventArgs e)
{
 
}

Check these help topics for more information:
http://www.telerik.com/help/aspnet-ajax/grid-commanditemtemplate.html
http://www.telerik.com/help/aspnet-ajax/ajax-force-controls-to-postback.html

Kind regards,
Vasil
the Telerik team

Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

0
Pawan
Top achievements
Rank 1
answered on 13 Jul 2013, 12:52 PM
How to find in the button click event which row got clicked and how to get the contents of the other columns in the row.

Thanks
0
Shinu
Top achievements
Rank 1
answered on 15 Jul 2013, 09:31 AM
Hi Pawan,

I guess you want to access selected row on button click event.Please try the below code snippet,to access the contents of the selected row,here multirow selection is enabled so that you can access all selected rows.Let me know if any concern.

ASPX:
<telerik:RadScriptManager ID="RadScriptManager2" runat="server">
</telerik:RadScriptManager>
<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="false"
    AllowPaging="true" AllowMultiRowSelection="true">
    <MasterTableView DataKeyNames="OrderID">
      <CommandItemTemplate>
        <asp:Button ID="Button1" Text="Select" runat="server" OnClick="Button1_Click">
        </asp:Button>
      </CommandItemTemplate>   
        <Columns>
            <telerik:GridBoundColumn UniqueName="OrderID" DataField="OrderID" HeaderText="OrderID" />
            <telerik:GridBoundColumn DataField="ShipCity" HeaderText="ShipCity" UniqueName="ShipCity" />
            <telerik:GridBoundColumn DataField="CustomerID" HeaderText="CustomerID" UniqueName="CustomerID" />
        </Columns>
    </MasterTableView>
    <ClientSettings Selecting-AllowRowSelect="true">
    </ClientSettings>
</telerik:RadGrid>

C#:
protected void Button1_Click(object sender, EventArgs e)
{
    foreach (GridDataItem dataItem in RadGrid1.SelectedItems)//To loop through all selected rows
    {
        int index = dataItem.ItemIndex;// Get Row Index
        string id = dataItem.GetDataKeyValue("OrderID").ToString();//Accessing the datakey value
        //Accessing Other Columns
        string ShipCity = dataItem["ShipCity"].Text;
        string CustomerID = dataItem["CustomerID"].Text;    
    }
}

Thanks,
Shinu
0
Pawan
Top achievements
Rank 1
answered on 15 Jul 2013, 03:50 PM
Thanks Shanu.

When i do this, on the postback all the values are lost. i am binding my datagrid on client side and my datasource is Array list(javascript). so the method in Button1_click the value for shipcity and others come as blank. also after the post back(button clikc), datagrid shows 2 records and both the records are empty. The array list which i am binding has only one row but the ondemand client event creates an empty table with  2 records as i have set page size to 1.Do you know why these values are getting lost and a way to retain those. i even tried enabling enableviewstate but still did not help.
Any help will be greatly appreciated.

0
Vasil
Telerik team
answered on 18 Jul 2013, 08:12 AM
Hi Pawan,

When you bind the grid client side, the values will not be accessible server side. If you need the data server side, you should bind server side.
And if you need to bind client side, then do your further logic on client button click using JavaScript.

Regards,
Vasil
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Tags
Grid
Asked by
Pooya
Top achievements
Rank 1
Answers by
Pooya
Top achievements
Rank 1
Vasil
Telerik team
Pawan
Top achievements
Rank 1
Shinu
Top achievements
Rank 1
Share this question
or