List Binding is not bound against a list for /JSONDataSet

Question

I have a JSON model, which I build from a Metadata set.

So I created that JSON array and did the following:

var oModel = new JSONModel({
  JSONDataSet: oJSONDataArray
});
this._oFragment.setModel(oModel);

In my fragment, I have a table:

<Table id="tableId" items="{ path:'/JSONDataSet' }">
  <columns>
    <Column>
      <Text text="HeaderColumn1"/>
    </Column>
    <!-- ... -->
  </columns>
  <ColumnListItem>
    <Text text="{Value1}"/>
    <!-- ... -->
  </ColumnListItem>
</Table>

Now everything works fine on my fragment. In my list, I'll see all that data from my JSON model, but I still receive this weird error in my console:

List Binding is not bound against a list for /JSONDataSet

How can I solve this issue?

What is a "Metadata set"? What are you actually displaying in the table? Do you have aggregation binding using ODataModel somewhere else? — Boghyon Hoffmann, Dec 20 '18 at 15:15
Is the above code the only place where `/JSONDataSet` is used as a binding path? — Boghyon Hoffmann, Dec 20 '18 at 15:19
How do you create `this._oFragment`? What is `oJSONDataAray` exactly? Please, provide an [MCVE](https://stackoverflow.com/help/mcve). Otherwise, we can only guess. — Boghyon Hoffmann, Dec 20 '18 at 15:27

Boghyon Hoffmann · Accepted Answer · 2019-03-24T17:47:20.017

List Binding is not bound against a list for ...

The above error occurs only in ODataListBinding.js and is thrown when the module fails to find the entityset name within the service $metadata document or if the resulting multiplicity is not "*". ^source

In your case, the framework assumes that JSONDataSet is some entity set name defined in the $metadata which obviously cannot be found. In order to prevent framework to search for that in $metadata, you'll need to tell that JSONDataSet is not from the unnamed default model (ODataModel) but from another model (JSONModel).

Try to give it a name, and assign the name in the binding definitions like this:

const oModel = new JSONModel({
  JSONDataSet: /*some data*/
});
this._oFragment.setModel(oModel, "anotherModel");

<Table id="tableId" items="{anotherModel>/JSONDataSet}">
  <!-- ... -->
  <ColumnListItem>
    <Text text="{anotherModel>Value1}"/>
    <!-- ... -->
  </ColumnListItem>
</Table>

The framework won't try to resolve anotherModel>/JSONDataSet until that model is registered and set to the fragment. The error will be gone since the framework now knows that it's not initializing ODataListBinding but a client ListBinding.

score 0 · Answer 2 · answered Dec 20 '18 at 10:08

If you take a look at the browser console, probably you have already an error telling you that "the template or factory function was not provided" or something similar.

In the following code, there is something missing

<Table id="tableId" items="{ path:'/JSONDataSet' }">
        <columns>
          .....
        <columns>
</Table>

if you do items="{ path:'/JSONDataSet' }", it means that you want the items in your list to be created dynamically based on the path /JSONDataSet from your model. This path should point to an array of some kind (usually an array of objects). Using UI5 terms, you are trying to use an aggregation binding.

However, how do you want the items in your Table to be created?

That's why you need to provide a template item, declaring an example item inside your table:

<Table id="tableId" items="{ path:'/JSONDataSet' }">
        <columns>
          .....
        <columns>
        <items>
            <ColumnListItem>
                <cells>
                    <ObjectIdentifier
                        title="{a}"
                        text="{b}"/>
                    <Text
                        text="{c}" />
                </cells>
            </ColumnListItem>
         </items>
</Table>

See more examples in the UI5 documentation.

In the code above, a, b and c are proprierties found in every object inside you array.

In the end, if you array contains 10 items, 10 rows will be created in your table. If you want to create columns dynamically, just provide a single Column example and use columns="{ path:'/JSONDataSet'} instead.

List Binding is not bound against a list for /JSONDataSet

2 Answers2

Linked