We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Item with template and href link

Thread ID:





121898 Feb 4,2016 06:58 PM UTC Feb 8,2016 07:22 AM UTC ASP.NET MVC 3
Tags: ListView(Mobile)
Emil Yotov
Asked On February 4, 2016 06:58 PM UTC

in ListView how to make HREF load link. Main items use template. How can the item to load link?

@Html.EJMobile().ListView("listView").EnableAjax(true).RenderMode(RenderMode.Windows).ShowHeader(false).AllowScrolling(true).AutoAdjustHeight(true).Items(items =>

Dhinesh Ravi [Syncfusion]
Replied On February 5, 2016 09:17 AM UTC

Hi Emil,

Thanks for contacting Syncfusion Support.

Templates are user defined elements used to customize the individual list items. When the templates are used inside ListView, the control will just fetch and renders the given templates as list items. Hence we need to align the templates and provide functionality to the respective list items. To achieve your requirement, i.e. to navigate to other pages, we suggest you to use, TouchEnd event of ListView. Refer to the following code example.


@Html.EJMobile().ListView("grouplist").ShowHeader(true).HeaderTitle("Template List").ClientSideEvents(evt => evt.TouchEnd("touch"))

Once the list item is selected, TouchEnd event will be triggered. In the event, we navigate to any view pages in the application using App.transferPage.

In the example, we have used ID and class for the templates, in order to  navigate to another view page based on the selected template list item. Refer to the following code example.


<div id="template1" class="template">Template 1</div>

<div id="template2" class="template">Template 2</div>

<div id="template3" class="template">Template 3</div>

<div id="template4" class="template">Template 4</div>


    function touch(args) {

        //returns the id of the template from the list item selected

        var viewPage = args.item.find(".template").attr('id');

        //Navigates to view page of respective template id

        App.transferPage(App.activePage, "/home/" + viewPage);



Once id is retrieved, we can navigate to another view page using the function, App.transferPage(fromPage, toPage) as explained in above code example.

Likewise, we can navigate to any viewpage based on the list item selected using App.transferPage.

We have created simple sample for the requirement. Refer to the sample in the following attachment.


Help Documentation Link : http://help.syncfusion.com/mobilejs/introduction/control-initialization

Dhinesh R

Emil Yotov
Replied On February 5, 2016 09:39 AM UTC

Thank you so much. Everything works.

Dhinesh Ravi [Syncfusion]
Replied On February 8, 2016 07:22 AM UTC

Hi Emil,

Thanks for the update.

We are happy to hear that everything works well. Please get back to us if you have any other concern.

Dhinesh R


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon