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

e.dataItem is null

1 Answer 77 Views
Data Source
This is a migrated thread and some comments may be shown as answers.
Robby Parker
Top achievements
Rank 1
Robby Parker asked on 01 Sep 2015, 12:17 PM

I start with a listview that contains all states with a click event on each to build event headers by state (below). Once a state is selected, ​I fetch event headers and build another listview using this function. Once an event header is selected, I populate a detail page. When loading fresh and selecting a state (Arkansas), the listview is populated and selecting an event populates the detail screen as expected. Hitting the "back" button (data-role=backbutton), selecting another state, then an event for that state throws e.dataItem undefined in the click ​method of the function below. If I go back again, select another state, then sometimes it works, sometimes it doesn't. What am I doing wrong here?

function BuildEventHeadersListByState(abbr)
{   
    app.showLoading();
 
    var stateAbbr = abbr;
    var xml;
    var template = kendo.template($("#ulEventHeaders-template").html());
     
    var dataSource = new kendo.data.DataSource({
        transport: {
            read: function(options){
            $.ajax( {
                type: "GET",
                url: "http://xxx.xxxxx.xxx/DuMobileService/GetEventHeadersByState",
                data: { "apikey": apiKey, "stateAbbreviation": stateAbbr},
                dataType: "text",
                    success: function(result) {
                        options.success(result);
                        app.view().header.find(".km-navbar").data("kendoMobileNavBar").title(abbr + " Events");
                        app.hideLoading();
                    }
                });
            }
        },
        schema: {
            type: "xml",
            data: "/ArrayOfEventHeader/EventHeader",
            model: {
                // configure the fields of the object
                fields: {
                    EventCity: "EventCity/text()",
                    EventDate: "EventDate/text()",
                    EventID: "EventID/text()",
                    EventTitle: "EventTitle/text()",
                }
            }
        }
    });
     
    $("#ulEventHeaders").kendoMobileListView({
        dataSource: dataSource,
        template: $("#ulEventHeaders-template").text(),
        dataBound: function(){
            this.scroller().reset(); //scroll to top
        },
        click: function(e){
            var eventID = e.dataItem.EventID;
            BuildEventDetailsByEventID(eventID);
        }
    });
}

1 Answer, 1 is accepted

Sort by
0
Kiril Nikolov
Telerik team
answered on 04 Sep 2015, 06:57 AM

Hello Robby Parker,

 

First of all apologies for the delayed reply.

 

I have tried to reproduce the issue but to no avail. Would it be possible to provide a runnable sample that we can look at and advise your further? You can use Kendo UI Dojo for this.

 

Regards,
Kiril Nikolov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Data Source
Asked by
Robby Parker
Top achievements
Rank 1
Answers by
Kiril Nikolov
Telerik team
Share this question
or