title: SAPUI5 bind JSON Model consisting of objects to sap.m. Table
body: <p>I have a problem binding my JSON Model to a <code>sap.m.table</code>. The model itself gets generated through an array which itself gets filled throughout the code and in the end it consists of different objects. </p>
  
  <p>Here's a screenshot of the object data:</p>
  
  <p><a href="https://i.stack.imgur.com/RXoEl.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/RXoEl.png" alt="Example data."></a></p>
  
  <p>That structure seems kind of weird to me since I always have to click the <strong>(...)</strong> in order to see the actual content. </p>
  
  <p>Anyhow, I try to bind the <strong>labelName</strong> and <strong>uploadName</strong> to a two-column-table. </p>
  
  <pre><code>&lt;m:Table id="emptyColumnText" rows="{/emptyColModel}"&gt;
     &lt;m:headerToolbar&gt;
         &lt;m:Toolbar height="2rem"&gt;
             &lt;m:Title text="{i18n&gt;excel.emptyColMessage}" /&gt;
          &lt;/m:Toolbar&gt;
     &lt;/m:headerToolbar&gt;
     &lt;m:columns&gt;
          &lt;m:Column&gt;
             &lt;m:Text text="Excel Upload" /&gt;
          &lt;/m:Column&gt;
          &lt;m:Column&gt;
             &lt;m:Text text="InfoObject" /&gt;
          &lt;/m:Column&gt;
       &lt;/m:columns&gt;
       &lt;items&gt;
          &lt;ColumnListItem&gt;
             &lt;cells&gt;
                 &lt;Text text="{/uploadName}" /&gt; //different approaches to 
                 &lt;Text text="{&gt;labelName}" /&gt;  // see what works
             &lt;/cells&gt;
           &lt;/ColumnListItem&gt;
       &lt;/items&gt;
  &lt;/m:Table&gt;
  </code></pre>
  
  <p>I already tried different approaches in binding the Model to the table items and also binding the upload-/labelName to the cells, but I haven't been successful yet. Also I'd like to do all of my binding in the <em>view</em>, not in the <em>controller</em>!</p>
  
  <p>Here's how I set my model:</p>
  
  <pre><code>var emptyColMessage = new sap.ui.model.json.JSONModel(emptyCol, 'emptyColModel');
  dialog.setModel(emptyColMessage); // a new dialog opens which should contain the model, so I thought I'd set the model to the dialog
  </code></pre>
  
  <p>and this is how <strong>emptyCol</strong> looks with one entry:
  <a href="https://i.stack.imgur.com/eQSfD.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/eQSfD.png" alt="emptyCol array"></a></p>
  
  <p>Looking at the UI5 Inspector. I see, that the table has a binding to the /emptyColModel but there are no items listed or anything that points to a correct binding.</p>
  
  <p><a href="https://i.stack.imgur.com/LhD4G.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/LhD4G.png" alt="existing binding of my table"></a></p>
  
  <p><a href="https://i.stack.imgur.com/yoUT3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/yoUT3.png" alt="no ColumnListItems"></a></p>
  
  <p>So how do I correctly bind my data? I tried several attempts of how I add the path. </p>
  
  <h2>Edit</h2>
  
  <p>I just looked at the model information an realized that the mmodel data looks like that:</p>
  
  <p><a href="https://i.stack.imgur.com/NLWAo.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/NLWAo.png" alt="model data"></a></p>
  
  <p>So I guess, accessing <strong>uploadName</strong> gets kind of hard when it's not an actual property of the model but only a string?</p>
  
  <p><strong>Edit 2</strong></p>
  
  <p>Update regarding @TiiJ7 's help</p>
  
  <pre><code>  if (emptyCol.length !== 0) {
       var emptyColMessage = new sap.ui.model.json.JSONModel({ emptyColModel: emptyCol });
        //    var emptyColMessage = new sap.ui.model.json.JSONModel(emptyCol, 'emptyColModel');
     }
     if (randomMatch.length !== 0) {
        var randomMatchMessage = new sap.ui.model.json.JSONModel({ randomColModel: randomMatch });
     }
     if (matchedColumn.length !== 0) {
          var matchedColumnMessage = new sap.ui.model.json.JSONModel({ matchedColModel: matchedColumn });
     }
     dialog.setModel(emptyColMessage, 'emptyColModel');
     dialog.setModel(randomMatchMessage, 'randomColModel');
     dialog.setModel(matchedColumnMessage, 'matchedColModel');
  </code></pre>
  
  <p>my xml code for the first table:</p>
  
  <pre><code>                             &lt;m:Table id="emptyColumnText" items="{/emptyColModel}"&gt;
                                  &lt;m:headerToolbar&gt;
                                      &lt;m:Toolbar height="2rem"&gt;
                                          &lt;m:Title text="{i18n&gt;excel.emptyColMessage}" /&gt;
                                      &lt;/m:Toolbar&gt;
                                  &lt;/m:headerToolbar&gt;
                                  &lt;m:columns&gt;
                                      &lt;m:Column&gt;
                                          &lt;m:Text text="Excel Upload" /&gt;
                                      &lt;/m:Column&gt;
                                      &lt;m:Column&gt;
                                          &lt;m:Text text="InfoObject" /&gt;
                                      &lt;/m:Column&gt;
                                  &lt;/m:columns&gt;
                                  &lt;m:items&gt;
                                      &lt;m:ColumnListItem&gt;
                                          &lt;m:cells&gt;
                                              &lt;m:Text text="{/emptyColModel&gt;labelName}" /&gt; //I again tried different solutions
                                             &lt;m:Text text="{uploadName}" /&gt;
                                          &lt;/m:cells&gt;
                                      &lt;/m:ColumnListItem&gt;
                                  &lt;/m:items&gt;
  
                              &lt;/m:Table&gt;
  </code></pre>