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

Resizable columns in Grid with detail template

7 Answers 215 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Lars
Top achievements
Rank 1
Lars asked on 09 Dec 2014, 11:45 AM
Hi,

When using a detail template and resizable columns, the resizing of the columns is not enabled. The example provided is using the MVC builder. Any help would be appreciated.

@(Html.Kendo().Grid<TelerikMvcApp4.Models.Model1>()
        .Name("abc")
        .Reorderable(conf => conf.Columns(true))
        .Resizable(conf => conf.Columns(true))
        .ColumnMenu()
        .ClientDetailTemplateId("template")
        .Columns(cols =>
        {
            cols.Bound(p => p.strName).Title("strName");
            cols.Bound(p => p.lAge).Title("lAge");
            cols.Bound(p => p.strComment).Title("strComment");
        })
            .BindTo(new TelerikMvcApp4.Models.Model1[] { new TelerikMvcApp4.Models.Model1() {
                lAge = 20
            }})
        )
    
<script id="template" type="text/kendo-tmpl">
    <div>Hi!</div>
</script>

Regards,

Ragnar Ă–sterlund

7 Answers, 1 is accepted

Sort by
0
Simon
Top achievements
Rank 1
answered on 10 Dec 2014, 08:14 PM
I am experiencing the same thing after updating to latest version of Kendo (I know it used to work a while back).
Here is a link to the dojo that demonstrates the issue: http://dojo.telerik.com/aMIpu
I basically started with detail template example and added resizable: true to the gridOptions.
0
Dimo
Telerik team
answered on 11 Dec 2014, 07:57 AM
Hello,

The discussed issue exists in the Q3 2014 Grid version and was fixed shortly after this release came out. You can use the latest internal build, which contains the fix.

Regards,
Dimo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Adam
Top achievements
Rank 1
answered on 29 Jan 2015, 04:48 PM

Dimo,

I'm not sure which version you were referring to, but I just upgrade my project to 2014.3.1316, and the problem remains.  Please see the following:

http://dojo.telerik.com/OnicU

Is the fix in that version, or in a later version?  I also noticed that resizing works as long as the outer grid is scrollable, but the detail grid cannot be resized if the outer grid is not scrollable, as the example shows.  Any ideas?

Thanks,
Adam

0
Dimo
Telerik team
answered on 30 Jan 2015, 09:34 AM
Hello Adam,

There are two separate issues here, hence the confusion.

Please enable scrolling for the master Grid to avoid the column resizing problem. We will provide a fix for non-scrollable master Grids in the next Kendo UI releases.

http://dojo.telerik.com/OnicU/3

Regards,
Dimo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Richard
Top achievements
Rank 1
answered on 20 May 2015, 02:52 PM

I'm still experiencing this issue where my grid columns inside a tabstrip cannot be resized without setting scrollable to true.  I am using the latest version of Kendo UI, v2015.1.429.

I've attached a kendo dojo export illustrating the problem.  Please let me know if this was not fixed in the latest version as stated above or if I am doing something wrong.

 As I see it I have two options for a workaround.

1. Enable scrolling but hide the vertical scrollbar.  I'm not a fan of this because I don't want horizontal scrolling to be possible.

2. Manually intercept the tabstrip select event and show the grids myself.  This would require some custom CSS to get the tabs aligned correctly but I think it should be pretty straight forward even though it defeats the purpose of using the framework.

Thanks!

0
Dimo
Telerik team
answered on 22 May 2015, 03:12 PM
Hi Richard,

The Grid is initialized from a <div> element, which belongs to the TabStrip - this is the TabStrip content container for the first tab. Such reusal of DOM elements across multiple widgets is not recommended and can lead to side effects, as in this case.

Please add one more child <div> inside the existing one and use that for the Grid instead.

Regards,
Dimo
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Richard
Top achievements
Rank 1
answered on 22 May 2015, 03:47 PM
Awesome!!! Thanks for the quick reply, that worked.
Tags
Grid
Asked by
Lars
Top achievements
Rank 1
Answers by
Simon
Top achievements
Rank 1
Dimo
Telerik team
Adam
Top achievements
Rank 1
Richard
Top achievements
Rank 1
Share this question
or