Split button inside GridTemplateColumn binding

2 posts, 0 answers
  1. Cristian
    Cristian avatar
    9 posts
    Member since:
    Aug 2013

    Posted 26 Oct 2015 Link to this post

     

    Hi guys.

     

    I'm new implementing radsplitbutton, I have my splitbutton inside a gridtemplateColumn declared as follows:

    <telerik:GridTemplateColumn  DataField="Portal_Id" UniqueName="templateCol">
                               <HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                          <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                          <ItemTemplate>
                                <asp:Label runat="server" ID="labelss" Text='<%# Bind("Portal_Id") %>' ></asp:Label>
           <telerik:RadButton runat="server"  ID="splitButton" EnableSplitButton="true" Text="Selecionar" Skin="Bootstrap" Width="200px" AutoPostBack="false" OnClientClicked="OnClientClicked" OnClientLoad="storeSplitButtonReference"></telerik:RadButton >
                               <telerik:RadContextMenu ID="RadContextMenu1" runat="server" Skin="Bootstrap"  OnClientLoad="storeContextMenuReference" >
                      <Items>
                          <telerik:RadMenuItem Text="Detalles" Value='<%# Eval("Portal_Id")%>'  NavigateUrl='<%# FriendlyUrl.Href("~/Portales/Details", DataBinder.Eval(Container,"Portal_Id"))%>' >
                              
                          </telerik:RadMenuItem>
                          <telerik:RadMenuItem Text="Editar" Value='<%# Eval("Portal_Id") %>'  NavigateUrl='<%# FriendlyUrl.Href("~/Portales/Edit",  Eval("Portal_Id"))%>' >
                          </telerik:RadMenuItem>
                          <telerik:RadMenuItem Text="Eliminar"  NavigateUrl='<%# FriendlyUrl.Href("~/Portales/Delete", Eval("Portal_Id"))%>'>
                               
                          </telerik:RadMenuItem>
                      </Items>
                  </telerik:RadContextMenu>
                                             
                          </ItemTemplate>
                      </telerik:GridTemplateColumn>

    What I want to do is to navigate through the navigateUrl Property of the radmenuItem and passing the portal_id wich is in a gridboundcolumn but when I click an item it redirects to the page without the portal_id, this behavior only occurs with radcontextmenu, as you can see I placed a label before the  button and bind the text property to the portal_id value and it is set correctly.

     

    Can you help me to get the correct redirection with the portal_id parameter.

     

    Best Regards

    Cristian.

  2. Danail Vasilev
    Admin
    Danail Vasilev avatar
    1494 posts

    Posted 29 Oct 2015 Link to this post

    Hello Cristian,

    You can find below a fully runnable sample on this regards. I have also highlighted the most important pieces of the code.

    <script>
     
        function storeSplitButtonReference() {
     
        }
     
        function storeContextMenuReference() {
     
        }
     
        var portalId;
        function OnClientClicked(sender, args) {
     
            if (args.IsSplitButtonClick()) {
                var parentEl = args.get_domEvent().target.parentNode.parentNode.parentNode;
                var rowIndex = parentEl.id.split("__")[1];
                var masterTable = $find("<%=RadGrid1.ClientID%>").get_masterTableView();
                portalId = masterTable.getCellByColumnUniqueName(masterTable.get_dataItems()[rowIndex], "Portal_Id").innerHTML;
                var menu = $find($telerik.$(parentEl).find(".RadMenu")[0].id.replace("_detached", ''));
                menu.showAt(1, 1);
            }
        }
     
        function OnClientItemClicking(sender, args) {
            var item = args.get_item();
            item.set_navigateUrl(item.get_navigateUrl() + "?" + portalId);
        }
    </script>
    <telerik:RadGrid ID="RadGrid1" runat="server" OnNeedDataSource="RadGrid1_NeedDataSource">
        <MasterTableView AutoGenerateColumns="false">
            <Columns>
                <telerik:GridBoundColumn DataField="ID" UniqueName="ID" HeaderText="ID"></telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="Portal_Id" UniqueName="Portal_Id" HeaderText="Portal_Id"></telerik:GridBoundColumn>
                <telerik:GridTemplateColumn UniqueName="templateCol">
                    <HeaderStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                    <ItemStyle HorizontalAlign="Center" VerticalAlign="Middle" />
                    <ItemTemplate>
                        <%# String.Format("http://www.telerik.com/?{0}", Eval("Portal_Id") ) %>
                        <asp:Label runat="server" ID="labelss" Text='<%# Bind("Portal_Id") %>'></asp:Label>
                        <telerik:RadButton runat="server" ID="splitButton" EnableSplitButton="true" Text="Selecionar" Skin="Bootstrap" Width="200px" AutoPostBack="false" OnClientClicked="OnClientClicked" OnClientLoad="storeSplitButtonReference"></telerik:RadButton>
                        <telerik:RadContextMenu ID="RadContextMenu1" runat="server" Skin="Bootstrap" OnClientLoad="storeContextMenuReference" OnClientItemClicking="OnClientItemClicking">
                            <Items>
                                <telerik:RadMenuItem Text='<%# Eval("Portal_Id")%>' Value='<%# Eval("Portal_Id")%>' NavigateUrl='http://www.telerik.com'>
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Editar" Value='<%# Eval("Portal_Id") %>' NavigateUrl='http://www.telerik.com'>
                                </telerik:RadMenuItem>
                                <telerik:RadMenuItem Text="Eliminar" NavigateUrl='http://www.telerik.com'>
                                </telerik:RadMenuItem>
                            </Items>
                        </telerik:RadContextMenu>
                    </ItemTemplate>
                </telerik:GridTemplateColumn>
            </Columns>
        </MasterTableView>
    </telerik:RadGrid>

    C#:
    protected DataTable GetData()
    {
        DataTable dt = new DataTable();
     
        dt.Columns.Add("ID", typeof(int));
        dt.Columns.Add("Portal_Id", typeof(int));
     
        dt.Rows.Add(1, 2);
        dt.Rows.Add(2, 5);
        dt.Rows.Add(3, 6);
        dt.Rows.Add(4, 4);
        dt.Rows.Add(5, 7);
     
        return dt;
    }
    protected void RadGrid1_NeedDataSource(object sender, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
    {
        (sender as RadGrid).DataSource = GetData();
    }


    Regards,
    Danail Vasilev
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top