How can I fix this problem: Cannot read property 'indexOf' of undefined

[former_member72715]

Hi experts.

I'm currently developing a SAPUI5 app and I want to do a little notification section.

I'm doing it with message popover and here is my code:

onInit: function() {
// create any data and a model and set it to the view
this.checkUser();
var oNotif = new sap.ui.model.odata.ODataModel(cnURI, false, "jdiaz", "sineti.01");
var oONotif = new sap.ui.model.json.JSONModel();
oNotif.read("/znoticeSet", undefined, undefined, false,
function(oData, response) {	oONotif.setData(oData);});
this.getOwnerComponent().setModel(oONotif,"notif");
	},

onOpenPopover: function (oEvent) {
	// create popover
if (!this._oPopover) {
this._oPopover = sap.ui.xmlfragment("popoverNavCon", "demo.fragments.NotificationPopOver", this);
this.getView().addDependent(this._oPopover);
			}
	this._oPopover.openBy(oEvent.getSource());
	},

onNavToProduct : function (oEvent) {
   var oCtx = oEvent.getSource().getBindingContext("notif");
   var oNavCon = Fragment.byId("popoverNavCon", "navCon");
   var oDetailPage = Fragment.byId("popoverNavCon", "detail");
         	oNavCon.to(oDetailPage);
		oDetailPage.bindElement(oCtx.getPath());
		},
onNavBack : function (oEvent) {
	var oNavCon = Fragment.byId("popoverNavCon", "navCon");
		oNavCon.back();
		},

And here is my xml fragment:

<core:FragmentDefinition
	xmlns="sap.m"
	xmlns:core="sap.ui.core">
	<Popover
		showHeader="false"
		contentWidth="420px"
		contentHeight="500px"
		placement="Bottom" >
		<NavContainer
			id="navCon">
			<Page
				id="notifications"
				title="Notificaciones">
				<List
					id="list"
					items="{notif>/results}" >
					<StandardListItem
						title="{notif>Head}"
						description="{notif>Fecha}"
						type="Active"
						press="onNavToProduct"
						iconDensityAware="false"
						iconInset="false" />
				</List>
			</Page>
			<Page
				id="detail"
				showNavButton="true"
				navButtonPress="onNavBack"
				title="Notificaciones">
				<ObjectHeader
				title="{notif>Head}" >
				<attributes>
				<ObjectAttribute text="{notif>Subhead}" />
				<ObjectAttribute text="{notif>Content}" />
						</attributes>
				</ObjectHeader>
			</Page>
		</NavContainer>
	</Popover>
</core:FragmentDefinition>

This is my result:

But when I want to consult one element of my list I recive no data and the error that I mentioned before. Here's the images:

And I get this error:

By the way my TileAdmin.controller.js line 67 is this: oDetailPage.bindElement(oCtx.getPath());

I hope you guys can help me!

Best Regards

[Ivan-Mirisola]

Hi Juan,

I've tried to reproduce your issue, but I didn't quite get the same error as you had.

Please take a look at the following sample from my git repository.

Check your odata mapping attributes on the fragment xml. It seems to me that you are using the odata binding in the wrong way.

Just specify the main collection on the List's items and then use each attribute directly.

Keep in mind that when you set the model on the fragment, it will be valid for all pages inside it. So, the detail's page will be bound to the same collection defined previously. Thus, you don't need to set any collections again.

Furthermore, there is a new notification list component to display notification messages. This component will shrink visible data and allows you to add buttons and remove actions.

Regards,
Ivan