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

multiple layouts not working?

3 Answers 133 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Roman
Top achievements
Rank 1
Roman asked on 07 Nov 2013, 05:25 PM
I'm trying to use multiple layout definitions without success. The views are always using the default one. The code is looking like that:
<div data-role="layout" data-id="default">
    <header data-role="header">
        <div data-role="navbar"> some content ... </div>
    </header>
    <footer data-role="footer">
        <div data-role="tabstrip"> some content... </div>
    </footer>
</div>
 
<div data-role="layout" data-id="layout2">
    <header data-role="header">
        <div data-role="navbar"> some other content ... </div>
    </header>
    <footer data-role="footer">
        <div data-role="tabstrip"> some other content... </div>
    </footer>
    </footer>
</div>
 
<div
    id="view1"
    data-role="view"
    data-layout="default"
>
   content...
</div>
 
<div
    id="view2"
    data-role="view"
    data-layout="layout2"
>
   content...
</div>
"view2" is using the default layout as well (instead of "layout2"). Am I doing something wrong? I just followed the layouts documentation.

3 Answers, 1 is accepted

Sort by
0
Petyo
Telerik team
answered on 08 Nov 2013, 02:23 PM
Hello Roman,

The approach should work in general. The code you have pasted has duplicate footer closing tags, though, so the layout may not be recognized properly.

Regards,
Petyo
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Roman
Top achievements
Rank 1
answered on 08 Nov 2013, 02:55 PM
Hi Petyo,
thanks for your reply. The double-footer was a mistake while copying the code into the forum. It's correct in the original code.

But I played around with it a bit more and found the problem. I had to specify a data-title attribute or the layout would not render the header at all, which contains:
<span data-role="view-title"></span>
If I remove the span with the view-title role, it works fine without data-title.

Strangely enough, this happens only for additional layouts, not for the first one defined as "default". It renders fine even with the constellation above. That's why I didn't realize the problem at first.
0
Kamen Bundev
Telerik team
answered on 12 Nov 2013, 01:48 PM
Hi Roman,

Which Kendo UI Mobile version are you using? I've tried to reproduce your issue in a jsBin, but to no avail. Can you check if I'm missing something?

Regards,
Kamen Bundev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
General Discussions
Asked by
Roman
Top achievements
Rank 1
Answers by
Petyo
Telerik team
Roman
Top achievements
Rank 1
Kamen Bundev
Telerik team
Share this question
or