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

multiple layouts not working?

3 Answers 174 Views

General Discussions

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

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>

</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

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.