[Solved] Grid with Pop Up does not work inside TabStrip

[Tai]

Hi,
I'm new with using Telerik and I have a problem about Grid inside TabStrip.

1. Content.Master
    <%= Html.Telerik().ScriptRegistrar()
                           .DefaultGroup(group => group
                                                    .Add("jquery-1.4.2.min.js")
                                                    .Add("telerik.common.js")
                                                    .Add("telerik.grid.js")
                                                    .Add("telerik.grid.filtering.js"))
    %>

2. ViewQuotationDetail.aspx
<%= Html.Telerik().TabStrip()
     .Name("Items")
     .Items(items =>
     {
         items.Add()
             .Text("Xây dựng")
             .HtmlAttributes(new { style = "font-weight:bold;vertical-align:top;" })
             .Selected(true)
             .LoadContentFrom("View_XayDung", "QuotationManagement", new{id = Model.QuotationID});        
     })
 %>

3. View_XayDung.ascx
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<TTArt.Web.Models.ViewModel.QuotationViewModel>" %>
        
        <%= Html.Telerik().Grid<TTArt.Web.Models.ViewModel.ItemViewModel>()
                                .Name("QuotationManagement")
                                .DataKeys(keys =>
                                {
                                    keys.Add(p => p.ItemID);
                                })
                                            .HtmlAttributes(new { style = "font-size:0.8em;" })
                .ToolBar(commands => commands.Insert().ButtonType(GridButtonType.Image).ImageHtmlAttributes(new { style = "margin-left:0" }))                      
                    .DataBinding(dataBinding =>
                    {
                        dataBinding.Ajax()
                            .Select("IndexAjax_XayDung", "QuotationManagement", new { id = Model.QuotationID })
                            .Insert("InsertAjax", "QuotationManagement")
                            .Update("UpdateAjax", "QuotationManagement")
                            .Delete("DeleteAjax", "QuotationManagement");
                    })
        .Columns(columns =>
            {
                columns.Bound(item => item.ItemName).Width(80).Title("Tên").HeaderHtmlAttributes(new { style = "text-align:left; font-weight:bold;" });                
                columns.Bound(item => item.Description).Width(120).HeaderHtmlAttributes(new { style = "text-align:left; font-weight:bold;" });
               
                columns.Command(commands =>
                {
                    commands.Edit().ButtonType(GridButtonType.Image).HtmlAttributes(new { style = "text-align:center; width:20px; padding-left:-50px;" });
                    commands.Delete().ButtonType(GridButtonType.Image).HtmlAttributes(new { style = "text-align:center;" });
                }).Width(185).Title("Thao tác").HeaderHtmlAttributes(new { style = "text-align:left; font-weight:bold;" });
            }
            )
        .Editable(edit => edit.Mode(GridEditMode.PopUp))
                    .RowAction(row =>
                    {
                        if (row.Index % 2 == 0)
                        {
                            row.HtmlAttributes["style"] = "background:#F0F0F0;";
                        }
                    })

        .Pageable()
        .Scrollable()
        .Sortable()
        %>

My problem is when I click Add button on the Grid, it does not show Insert Pop Up dialog but shows a new page without any css. I try to change GridEditMode = InLine (or InForm), the problem still occurs. I wonder what thing I miss or anything is wrong in my codes.

I very appciate with your help.

Thanks in advance.

[Georgi Krustev]

Hi Tai,

I believe that the scripts required for grid editing is not loaded (because of the Ajax rendering). I noticed that you are registering telerik.grid.js and telerik.grid.filtering.js file. You should also minimum register telerik.grid.editing.js file. For more concrete information, which files you should register check this online help article.

Kind regards,
Georgi Krustev
the Telerik team

[Tai]

Thanks Admin,

I've just resolved my problem. :-)