Dynamic Tab with imbedded gid

2 posts, 0 answers
  1. Sheldon
    Sheldon avatar
    12 posts
    Member since:
    Oct 2013

    Posted 27 Jun 2014 Link to this post

    Hi There,

    I am working on an editor for a multi-lingual product catalogue and am trying to use a mixture of tabs and grids to show the properties for each product in multiple languages.

    I am working in MVC and my product controller passes a model to a view that contains all the product info for each languages.   I am then trying to dynamically create the tab strip so that each language becomes a separate tab.    Within each tab I call a partial view and pass a model that is filterer by that tab's particular language.

    Everything seems to work except that I can't seem to click on any of the tabs that are created .... the only one that is displayed is the one I select programmatically (see below).

    (*** View ***)
    @(Html.Kendo().TabStrip()
    .Name("LanguageProductTab3")
    .Items(items =>
        {       
             foreach(string lang in @ViewBag.Languages)     
             {
                  items.Add()
                  .Text(lang)
                  .Enabled(true)
                  .Content(@Html.Partial("~/Views/Shared/_LanguageProduct.cshtml", (from u in Model where u.Language == lang select u)).ToHtmlString()).Selected(lang == "EN");      
             }
       }));

    (*** Partial View ****)

    @model IEnumerable<NewGlobalProductCatalogue.Models.usp_IPCGetProductInfo_Result>
    @{var lang = (from u in Model select u.Language).First(); }
    @{var gridname = "ProductGrid_" + lang.ToString(); }<p> @gridname </p>
        @(Html.Kendo().Grid(Model)
            .Name(gridname)
        .Columns(columns =>
        {
            columns.Bound(product => product.ColumnID);
            columns.Bound(product => product.ColumnName);
            columns.Bound(product => product.Language);
            columns.Bound(product => product.FieldName);
            columns.Bound(product => product.FieldIDValue);
            columns.Bound(product => product.MasterDataValue);
            columns.Bound(product => product.Prefix);
           @* columns.Bound(product => product.MasterDataTableName); *@
        })
        .Pageable()
        .Sortable()
        )

    As I said, the tabs display and the first grid shows up fine, it is just that I am unable to click on any of the other language tabs and have it witch to that view.

    Some items of note:

    1) I am using the jquery 1.10.2
    2) As you can see, the grid is named differently depending on the language
    3) I created a simple grid with no partial views and that worked fine.
    4) haven't tried using .loadcontentfrom because it seemed unnecessary in this case ... I have all the data there in the view ... it is just a matter of slicing it up correctly, which is what the linq query is doing.

    Any suggestions?

  2. Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 01 Jul 2014 Link to this post

    Hello Sheldon,

    The provided information indicates that there is a Javascript error on the page. Have you verified that? If you can't see anything suspicious, please provide a runnable demo.

    Regards,
    Dimo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
Back to Top