Is it possible to bind a ListView to an ObservableArray of <li> elements?

2 posts, 0 answers
  1. Calvin
    Calvin avatar
    42 posts
    Member since:
    Jul 2011

    Posted 14 Jan 2013 Link to this post


    Is it possible to bind a ListView to a collection of HTML elements?

    If items is an ObservableArray of <li> elements, what goes into the template?  Or is a template necessary?

    <script id="li-template" type="text/x-kendo-template">

        ???? WHAT GOES HERE if items is a collection of <li> elements


    <ul id="documentsList" data-role="listview" data-bind="source: items" data-template="li-template"></ul>

    Incidentally, the reason the items collection contains HTML elements (<li>) rather than data objects is because the list-items wrap Seadragon.Viewer objects.  The constructor for a Seadragon.Viewer object takes a container HTML element as its parameter.  At this point, I’m merely exploring ways to convert this section of code to an MVVM approach using declarative bindings.  Toward that end, binding to the ObservableArray of <li> elements would be a first step.  But if there is a better approach – I suspect there is – then I would certainly like to hear about it.

  2. Alexander Valchev
    Alexander Valchev avatar
    2887 posts

    Posted 16 Jan 2013 Link to this post

    Hi Calvin,

    I am afraid that what you would like to achieve is not supported. The source binding works with DataSource or Observable array of objects. You cannot create Observable object from a <li> element, the source should contain data which will be used when the template (mark-up) is rendered. For more information please check this help topic.

    Kind regards,
    Alexander Valchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top