hi, these are my codes for infinite scrolling but its not working .
i posted the code please check and i also debug the code but my action also not running ..
i provided the code below please check...
@(Html.Kendo().MobileView()
.Title("Scroll down to load")
.Content(obj =>
Html.Kendo().MobileListView<TelerikMvcApp5.ShoppingModel.PRODUCT_IMAGE>()
.Name("endless-scrolling")
.TemplateId("template")
.EndlessScroll(true)
.ScrollTreshold(30)
.DataSource(dataSource =>
dataSource
.Read("Scroll", "Image")
.PageSize(20)
)
)
)
<script type="text/x-kendo-tmpl" id="template">
<div class="product">
<img src="#=IMAGENAME#" alt="image" class="pullImage"/>
</div>
</script>
<style scoped>
.product h3 {
font-size: 1.3em;
font-weight: normal;
line-height: 1.4em;
margin: 0;
padding: .5em 0 0;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.product p {
font-size: 1em;
margin: 0;
padding: .3em 0 0;
}
.pullImage {
width: 64px;
height: 64px;
border-radius: 3px;
float: left;
margin-right: 1em;
}
</style>
This is my action with controller
public class ImageController : Controller
{
ShoppingEntities db = new ShoppingEntities();
//
// GET: /Image/
public ActionResult Index()
{
return View();
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResultScroll([DataSourceRequest] DataSourceRequest request)
{
var list = db.PRODUCT_IMAGE.ToList();
return Json(list.ToDataSourceResult(request));
}
}
i posted the code please check and i also debug the code but my action also not running ..
i provided the code below please check...
@(Html.Kendo().MobileView()
.Title("Scroll down to load")
.Content(obj =>
Html.Kendo().MobileListView<TelerikMvcApp5.ShoppingModel.PRODUCT_IMAGE>()
.Name("endless-scrolling")
.TemplateId("template")
.EndlessScroll(true)
.ScrollTreshold(30)
.DataSource(dataSource =>
dataSource
.Read("Scroll", "Image")
.PageSize(20)
)
)
)
<script type="text/x-kendo-tmpl" id="template">
<div class="product">
<img src="#=IMAGENAME#" alt="image" class="pullImage"/>
</div>
</script>
<style scoped>
.product h3 {
font-size: 1.3em;
font-weight: normal;
line-height: 1.4em;
margin: 0;
padding: .5em 0 0;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.product p {
font-size: 1em;
margin: 0;
padding: .3em 0 0;
}
.pullImage {
width: 64px;
height: 64px;
border-radius: 3px;
float: left;
margin-right: 1em;
}
</style>
This is my action with controller
public class ImageController : Controller
{
ShoppingEntities db = new ShoppingEntities();
//
// GET: /Image/
public ActionResult Index()
{
return View();
}
[AcceptVerbs(HttpVerbs.Post)]
public ActionResultScroll([DataSourceRequest] DataSourceRequest request)
{
var list = db.PRODUCT_IMAGE.ToList();
return Json(list.ToDataSourceResult(request));
}
}