This is a migrated thread and some comments may be shown as answers.

how to show loading image while loading items in listview HTML helper

3 Answers 895 Views
ListView
This is a migrated thread and some comments may be shown as answers.
Kalpana
Top achievements
Rank 1
Kalpana asked on 15 Aug 2017, 01:18 PM

I'm using HTML helper list view. I'm not getting loading image or loading message while loading the Items in the listview HTML helper. Also, how to display "No items to display" message when the listview is empty. Below is the code that I have

 
   <div class="col-sm-12 k-content wide">
        @(Html.Kendo().ListView<CNO.CA.MemberPortal.Web.UI.Viewmodels.DocumentManagementModel>(Model.document)
            .Name("DocumentslistView")
            .TagName("div")
            .ClientTemplateId("template")
            .DataSource(datasource => datasource
            .Read(read => read.Action("GetDocumentsByPersonId", "Profile"))
            .Model(m => m.Id("ID"))
            .ServerOperation(false)
            .PageSize(10))
            .Pageable()                    
             )
)
    </div>

3 Answers, 1 is accepted

Sort by
0
Stefan
Telerik team
answered on 17 Aug 2017, 08:06 AM
Hello Kalpana,

The Kendo UI ListView has a loading indicator by default. This can be observed in our demo:

http://demos.telerik.com/aspnet-mvc/listview/remote-data-binding

Currently, the ListView does not support "No data" template.

I can suggest submitting a feature request and based on its popularity we may implement it in a future release:

http://kendoui-feedback.telerik.com/forums/127393-kendo-ui-feedback/category/170328-listview

For now, I can suggest custom container where the message can be displayed if there is no data. This can be achieved using jQuery on the dataBound event. The same approach can be used for the MVC ListView as it uses a client side logic

https://dojo.telerik.com/ABehE

http://docs.telerik.com/kendo-ui/api/javascript/ui/listview#events-dataBound

Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Kalpana
Top achievements
Rank 1
answered on 17 Aug 2017, 02:59 PM

 

 

Hi Stefan, thanks for the reply ! I'm getting loading message when I refresh or rebind the list view. I'm not getting the loading image while loading list view for the first time.

<%: Html.Kendo().ListView<ProductViewModel>()

.Name("listView").TagName("div")

.ClientTemplateId("template")

.DataSource(dataSource => { dataSource.Read(read => read.Action("Products_Read", "ListView"));})

.Events(e => e .DataBound("productListView_dataBound")

.Change("productListView_change")) %>

<script>

function productListView_dataBound()

 {

//handle databound event

}

</script>

 

it throws error saying productListView_dataBound is undefined. What am I missing here?

0
Stefan
Telerik team
answered on 21 Aug 2017, 08:20 AM
Hello Kalpana,

Thank you for the provided code.

Based on it can assume that there is an issue defining the name with an underscore. 

When I tested it, I received the same error with that function name. When a changed it to a name with no underscore the function was called as expected.

Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
ListView
Asked by
Kalpana
Top achievements
Rank 1
Answers by
Stefan
Telerik team
Kalpana
Top achievements
Rank 1
Share this question
or