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

Linebreaks break listview links

3 Answers 99 Views
ListView (Mobile)
This is a migrated thread and some comments may be shown as answers.
Oscar
Top achievements
Rank 1
Oscar asked on 06 Apr 2012, 05:06 PM
After spending a decent amount of time trying to figure out why my listview didn't work, I discovered that the following code doesn't work:

    <ul data-role="listview" data-style="inset">
        <li data-icon="toprated">
            <a>Nairobi</a>
        </li>
    </ul>

However this work:

    <ul data-role="listview" data-style="inset">
        <li data-icon="toprated"><a>Nairobi</a></li>
    </ul>

 It seems that adding a space between the <li> and the <a> makes it break, causing no icons or links to work correctly (doesn't load the view but treats it as an external link). This is in build 2012.1.406.

Just wanted to point it out for anybody else who might struggle with this. :-)


3 Answers, 1 is accepted

Sort by
0
Petyo
Telerik team
answered on 09 Apr 2012, 07:53 AM
Hi,

I can confirm that. Automatic link styling is triggered on when the link is the only child of the li element. Whitespace is also DOM elements. 

Although the whitespace elements can be iterated and ignored, this would be quite performance intensive, especially for a mobile device. 

Regards,
Petyo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Oscar
Top achievements
Rank 1
answered on 09 Apr 2012, 10:15 PM
I understand, and it might not be a huge issue for many, however it might be a good idea to mention this in the documentation or the examples, since many people have editors which do some sort of tidying on the HTML or similar, which might not understand why it don't work.

The linebreak notation:

<li>
  <a>asa</a>
</li>

is quite a common form for keeping HTML readable and structured and is what most people are taught through tutorials etc. :-)
0
Petyo
Telerik team
answered on 10 Apr 2012, 07:43 AM
Thanks for the feedback - indeed this is an inconvenience worth mentioning. 

Kind regards,
Petyo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
ListView (Mobile)
Asked by
Oscar
Top achievements
Rank 1
Answers by
Petyo
Telerik team
Oscar
Top achievements
Rank 1
Share this question
or