Error saying "object doesn't support method or property createListBinding" when using ListView

Question

I'm using two ListViews in my app to display content, one works perfectly fine but the other throws an exception on launch. My html code of the ListView failing:

<div id="menuTemplate" data-win-control="WinJS.Binding.Template">
    <div style="width:280px; height:80px;">
        <h2 data-win-bind="innerHTML:displayText"></h2>
    </div>
</div>
<div id="lectorganizeMenu" data-win-control="WinJS.UI.ListView"
        data-win-options="{itemDataSource:menuSource.data,
        itemTemplate:select('#menuTemplate')}">
</div>

In my javascript file connected with the html file I have the following lines at the beginning:

var menuList = new WinJS.Binding.List([{ displayText: 'Add Course'}]);
WinJS.Namespace.define('menuSource', { data: menuList });

When i comment out the lecorganizeMenu div the exception is not thrown so i know that it is the part failing.

Answer 1

A ListView cannot bind directly to a WinJS.Binding.List. You need to bind to its dataSource property. That is, in your lectorganizeMenu control, bind itemDataSource to menuSource.data.dataSource. You're probably doing something like that in the ListView that works, or using a createGrouped, createSorted, or createFiltered projection.

You can see the use of dataSource in the example in the docs: http://msdn.microsoft.com/en-us/library/windows/apps/hh700703.aspx.

Kraig

Author, Programming Windows Store Apps with HTML, CSS, and JavaScript, Second Edition, a free ebook from Microsoft
Press. First edition (for Windows 8) also available.

Answer 2

Thanks, in the other listview i use a customized dataSource so that case was a bit different.