Hi,
Is there a way to load a content of an external file onto a ScrollView?
Suppose I have a file named data.html with the following content:
data.html
<b>
This is a sample text in data.html
</b>
Then I have a kendoUI page like this:
<!DOCTYPE html>
<html>
<head>
<title></title>
<link href="css/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="css/kendo.default.min.css" rel="stylesheet" type="text/css" />
<link href="css/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
<link href="css/TON/generic.css" rel="stylesheet" type="text/css" />
<script src="cordova-2.5.0.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/kendo.mobile.min.js"></script>
<script src="js/kendo.all.min.js"></script>
</head>
<body>
<!-- This is our Main Tab -->
<div data-role="view" id="pregnancyarticledetails" data-layout="default" data-title="Shocker" data-init="mobileListViewDataBindInitFlat">
<div id="article_content">
<div style="height:5px;"> </div>
<div id="pregnancy_detail" data-role="scroller" class="scroller-content"></div>
<div style="height:76px;"> </div>
</div>
</div>
<script>
$("#pregnancy_detail").load("data.html");
</script>
</body>
</html>
The ScrollView seems to be empty. Has anyone done something like this? Any ideas you can share please? Thanks!
Antonio
Is there a way to load a content of an external file onto a ScrollView?
Suppose I have a file named data.html with the following content:
data.html
<b>
This is a sample text in data.html
</b>
Then I have a kendoUI page like this:
<!DOCTYPE html>
<html>
<head>
<title></title>
<link href="css/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="css/kendo.default.min.css" rel="stylesheet" type="text/css" />
<link href="css/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
<link href="css/TON/generic.css" rel="stylesheet" type="text/css" />
<script src="cordova-2.5.0.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/kendo.mobile.min.js"></script>
<script src="js/kendo.all.min.js"></script>
</head>
<body>
<!-- This is our Main Tab -->
<div data-role="view" id="pregnancyarticledetails" data-layout="default" data-title="Shocker" data-init="mobileListViewDataBindInitFlat">
<div id="article_content">
<div style="height:5px;"> </div>
<div id="pregnancy_detail" data-role="scroller" class="scroller-content"></div>
<div style="height:76px;"> </div>
</div>
</div>
<script>
$("#pregnancy_detail").load("data.html");
</script>
</body>
</html>
The ScrollView seems to be empty. Has anyone done something like this? Any ideas you can share please? Thanks!
Antonio
3 Answers, 1 is accepted
0
Hi Antonio,
You don't have any ScrollView in your example, I'll assume you actually talk about the Scroller.
The Kendo UI Mobile Scroller has an internal container that holds the scrolling content, check the scrollElement Scroller property which you can use to load contents in it.
Greetings,
Kamen Bundev
the Telerik team
You don't have any ScrollView in your example, I'll assume you actually talk about the Scroller.
The Kendo UI Mobile Scroller has an internal container that holds the scrolling content, check the scrollElement Scroller property which you can use to load contents in it.
Greetings,
Kamen Bundev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Accepted
Antonio
Top achievements
Rank 1
Rank 1
answered on 24 Apr 2013, 05:44 AM
Thanks! I tried this out.
It took me awhile though to figure out that it is actually the html() method within scollElement.
Can this be added to the documentation please? I'm sure some people have the same/similar questions like this.
Thanks!
Antonio
It took me awhile though to figure out that it is actually the html() method within scollElement.
var scroller = $("#babycare_detail").kendoMobileScroller();<br>scroller.data("kendoMobileScroller").scrollElement.html("<b>Blah blah blah...</b>");Can this be added to the documentation please? I'm sure some people have the same/similar questions like this.
Thanks!
Antonio
0
Hello Antonio,
There is now a fields section in both View and Scroller articles that have examples how to replace the content.
Greetings,
Kamen Bundev
the Telerik team
There is now a fields section in both View and Scroller articles that have examples how to replace the content.
Greetings,
Kamen Bundev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!