Questions on Kendo UI for jQuery Forum

0 answers

173 views

dynamically assign a datasource to a scrollview at runtime

Just building a mobile web site and have various content pages that have gallery content on so will use a scroll view to display the data.

Not all pages will have a gallery and each gallery is different.

I dont want to have to create x number of datasources for each gallery and then have x number of views with the different scrollview and content in.

I want to create one datasource and assign the datasource to the scrollview at runtime called from a web service with different parameters based on what content page is being called.

So here's my view code:

<div data-role="view" data-layout="mobile-tabstrip" id="tabstrip-contentr" data-show="initcontent">

<div class="content">

<div id="cntpagehtml"></div>

<div data-role="scrollview" data-autobind="false" id="my-scrollview"

data-template="scrollview-binding-template" data-enable-pager="true">

</div>

<script id="scrollview-binding-template" type="text/x-kendo-template">

<div style="width:300px;">

<div>

<img src="/webimages/gallery/#: Image #" class="slider" /></div>

<div class="title">#= Caption #</div>

</div>

</script>

</div>

I have set autobind to false and not given it a data source so it doesn't bind

Heres my call to get the data passing in the section

function GetGallery(sectionid) {

var _GalleryDS = new kendo.data.DataSource({

transport: {

read: {

url: "mobiledata.asmx/GetGallery",

dataType: "json",

type: "POST",

data: { SectionID: sectionid },

contentType: "application/json; charset=utf-8"

},

parameterMap: function (data, operation) {

data = $.extend({}, data);

return JSON.stringify(data);

}

},

serverPaging: true,

pageSize: 30,

schema: {

data: "d[0].Items", total: "d[0].TotalItems"

},

change: function () {

$("#my-scrollview").data('kendoMobileScrollView').refresh();

}

});

}

I now need to somehow assign the returned datasource in my data-show event code:

function initcontent(e) {

var scroller = e.view.scroller;

scroller.reset();

GetContent("#cntpagehtml", e.view.params.p);

var Section = 0;

switch(e.view.params.p)

{

case "meet-the-team":

GetGallery(3);

//Assign the _GalleryDS to my scrollview......

break;

case "design-consultancy":

GetGallery(6);

//Assign the _GalleryDS to my scrollview......

break;

case "point-of-sale":

GetGallery(4);

//Assign the _GalleryDS to my scrollview......

break;

default:

}

};

Anyone help, is it possible? or should i be doing it a different way?

Thanks

Jon.

ScrollView (Mobile)

asked on 02 Aug 2013

0 answers

351 views

Is there a way to disable swipe events?

I'm using a ScrollView as a carousel to house some questions and need to disable swipe events for it (I'm using "next" and "previous" buttons to control it). The problem I'm coming across is that I have a jQuery-UI slider inside the ScrollView, but when I try to change the slider value, it starts to move the ScrollView to the next "page".

I was hoping there was a native way to disable "swipe to move", but it doesn't appear that there is.

I've played around with catching the events on the ScrollView pages, but haven't been able to get something that works on an actual device:

$('#scrollview-container [data-role="page"]').on('mousedown', function(e) {

console.log('mousedown');

e.stopImmediatePropagation();

});

$('#scrollview-container [data-role="page"]').on('touchstart', function(e) {

console.log('touchstart');

e.stopImmediatePropagation();

});

Any ideas or help would be appreciated.

ScrollView (Mobile)

asked on 10 Nov 2012

0 answers

49 views

Scrollview with href

Hi,

       How do I put a hyperlink on each picture base on the sample code in scrollview?

        The sample code is using <div> and I'm not sure where to put the <a href=""> <a> to make it a hyperlink to navigate to other html page.

        Please help.

Thanks,
Core

ScrollView (Mobile)

asked on 01 Nov 2012

0 answers

80 views

Scroll view is not working with MVC 3

HI,

i am planning to use Scrollview control for my mobile app. i tried scroll view in html page of normal aspx app, it is working.

we are planning to create a mobile app using MVC3. i tried the scroll view and mobile swith with mvc 3, it is not working.

How to get these controls with MVC 3.

Is it working with MVC 3?

Kindly let me know the details.

Thanks,
Uma

ScrollView (Mobile)

asked on 17 Sep 2012

0 answers

69 views

1 page more than defined

Hello,

I did remove all the content this thread.
I did read the posting HTML Content instead of images Started by Josh Lipford

But at first I was not aware that a second problem was discussed there of having 1 more page than defined.

So it works now for my solution.

Greetings Johan Borchers

ScrollView (Mobile)

asked on 10 Jun 2012

0 answers

73 views

Mobile Listview control custom template

i want bind the data to listview through pagemethods, but it is not binding.
1. can i use pagementhod for lisview databinding ?

Please check the code and give me the suggestions......

<div data-role="view" id="listview-templates" data-title="ListView" data-init="mobileListViewTemplatesInit">
<ul id="custom-listview">
</ul>
</div>

function mobileListViewTemplatesInit() {
PageMethods.GetEventTrainees(function (response) {
groupedData = response.split("#");
});
$("#custom-listview").kendoMobileListView({
dataSource: kendo.data.DataSource.create({ data: groupedData }),
template: $("#customListViewTemplate").html()
});
}

ScrollView (Mobile)

asked on 14 May 2012

0 answers

52 views

About using form controls and scrolls it.

Hi,

Is it possible to use scrollview with form's control like input type=text ?
I'm able to use textbox with scrollview but I am unable to type anything in it? Is scrolling be only use with images?

Thanks,
Mangesh

ScrollView (Mobile)

asked on 03 Apr 2012

0 answers

143 views

Kendo Scrollview full screen

Hello guys,

I'm using the scroll view like in your example that makes a small gallery.
How can i make that example full screen?

Seems difficut since there are many wrapping divs generated by kendo,
There are divs such as .km-scroll-container, .km-content, #scrollview-container, and another one
generated in between the photo divs and the data-role='scrollview' div, etc...

what is the right way?

ScrollView (Mobile)

asked on 22 Feb 2012

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools