Creating a blog reader app

[Tunde]

I am currently programing a blog reader application using HTML5 KendoUI Mobile & JavaScript currently i am able to use Json to list all my post in a list view and currently once an item is clicked on it takes me to the actual url of the post within the application. What i want to be able to do is once an item is clicked on display post content in a different view. Please help me!!!

<div data-role="view" data-init="mobileListViewPullToRefresh" data-title="What's New" id="tabstrip-whatsnew" data-layout="mobile-tabstrip">

    <ul id="pull-to-refresh-listview"></ul>
</div>

<script id="pull-to-refresh-template" type="text/x-kendo-template">
    <div class="post">
        <a href="#= url #"><img class="menuimage" src="#= thumbnail_images.full.url #" alt="#= title #" /></a>
        <a href="#= url #"><span class="title">#= title #</span> </a>
    </div>
</script>

<script>
    function mobileListViewPullToRefresh() {
            var dataSource = new kendo.data.DataSource({
                serverPaging: true,
                pageSize: 10,
                transport: {
                    read: {
                        url: "http://www.iviewsource.com/?json=recentstories", // the remote service url - Twitter API v1.1
                        dataType: "jsonp" // JSONP (JSON with padding) is required for cross-domain AJAX
                    },
                    parameterMap: function(options) {
                        return {
                            q: "javascript",
                            count: options.pageSize
                        };
                    }
                },
                schema: { // describe the result format
                    // the data which the data source will be bound to is in the "results" field
                    data: function(data) {
                        return data.posts || [];
                    }
                }
            });

        $("#pull-to-refresh-listview").kendoMobileListView({
            dataSource: dataSource,
            pullToRefresh: true,
            appendOnRefresh: true,
            template: $("#pull-to-refresh-template").text()
        });
    }
</script>

[Petyo]

Hello Tunde,

A list -> detail navigation pattern is demonstrated in our demo sushi application. In your case, you may have to perform an additional ajax request in the detail view show event handler in order to display the post contents. 

Regards,
Petyo
Telerik