Question

I have a cordova application that is using Kendo UI for the front end. When I click on a link that is attached to one of my list view items the screen will lock up and not allow me to go to any other pages. I have tried the same links outside of the list view in their own buttons and it works without a problem.

This is the code that I have

<div id="detailList">
            <ul data-role="listview" data-style="inset" data-type="group">

                <li>
                    <ul>
                        <li><a href="tel:#:mobilephone#"><span class="sectionTitle">phone</span> #:mobilephone#</a></li>
                        <li><a href="mailto:#:email#"><span class="sectionTitle">email</span> #:email#</a></li>         
                    </ul>
                </li>
                <li>
                    <ul>
                    <li><span class="sectionTitle">specialtie(s)</span> #:specialties#</li>
                    <li><span class="sectionTitle">keyword(s)</span> #:keywords#</li>
                    </ul>
                </li>
            </ul>
        </div>

If I place

<a href="mailto:#:email#" class="ios-button email" data-icon="email">Email</a>

somewhere outside of the listview ul, I can hit the button, it will open up the mail application and when I come back to my app, I am able to navigate without any issues. Wondering if anyone else has ran into this problem and if so, how to solve it.

Answer 1

To keep your links from being treated as navigation and using the hashed url, add data-rel=”external” to your links within the list items.