title: How to set filter in table dropdown based on table row data
body: <p>The following question was driven by this SAPUI5 topic on SCN: <a href="http://scn.sap.com/thread/3605374" rel="nofollow noreferrer">2 dropdownboxs, filtering second off the the value in first</a></p>
  
  <ul>
  <li>We have a SAPUI5 table, containing two columns, each record in the table shows a dropdown: one for Divisions, and one for Business Units.</li>
  <li>Depending on the value of the selected Division, the Business Unit dropdown should only show the BU's which are valid for the chosen division</li>
  <li>The actual table data is stored in a named model <code>tablemodel</code>, the data for the dropdowns is stored in a named model <code>metamodel</code></li>
  </ul>
  
  <p>See below example of how the table should look like:</p>
  
  <p><img src="https://i.stack.imgur.com/ray97.png" alt="This is what the table should look like"></p>
  
  <p>In order to be able to filter the Business Units on Division, the named model <code>metamodel</code> looks like:</p>
  
  <pre class="lang-js prettyprint-override"><code>divisions: [
      {
          division    : "div1",
          divisiondesc: "Division 1"
      }, 
      {
          division    : "div2",
          divisiondesc: "Division 2"
      }, //etc
  ],
  bunits: [
      {
          busunit    : "bus1",
          busunitdesc: "Business Unit 1",
          division   : "div1"
      }, 
      {
          busunit    : "bus2",
          busunitdesc: "Business Unit 2",
          division   : "div3"
      }, //etc
  ]
  </code></pre>
  
  <p>so the 2nd dropdown (which binds to <code>/bunits</code>) can be filtered on property <code>division</code>.</p>
  
  <p>The <code>sap.ui.commons.table.Table</code> is built in a JSView component as follows:</p>
  
  <pre class="lang-js prettyprint-override"><code>var oTable = new sap.ui.table.Table()
      //First column w/ dropdown Divisions
      .addColumn(new sap.ui.table.Column({
          label: new sap.ui.commons.Label({
              text: "Division"
          }),
          template: new sap.ui.commons.DropdownBox({
              selectedKey: "{tablemodel&gt;division}",
              items: {
                  path: "metadatamodel&gt;/divisions",
                  template: new sap.ui.core.ListItem({
                      text: "{metadatamodel&gt;divisiondesc}",
                      key: "{metadatamodel&gt;division}"
                  })
              }
          })
      }))
      //Second column w/ dropdown Business Units, which should be filtered
      .addColumn(new sap.ui.table.Column({
          label: new sap.ui.commons.Label({
              text: "Business Unit"
          }),
          template: new sap.ui.commons.DropdownBox({
              selectedKey: "{tablemodel&gt;bus_unit}",
              items: {
                  path: "metadatamodel&gt;/bunits",
                  template: new sap.ui.core.ListItem({
                      text: "{metadatamodel&gt;busunitdesc}",
                      key: "{metadatamodel&gt;busunit}"
                  })
                  ,
                  filters: [new sap.ui.model.Filter("division", sap.ui.model.FilterOperator.EQ, "{tablemodel&gt;division}")]
              }
          })
      }))
      .bindRows("tablemodel&gt;/");
  </code></pre>
  
  <p>As you can see from the above, the intended behavior is that the second dropdown will be filtered on property <code>division</code> with the value of the current table's <code>division</code> property (i.e. <code>{tablemodel&gt;division}</code>).</p>
  
  <p>(The full code <a href="http://jsbin.com/bodak/1/edit?js,output" rel="nofollow noreferrer">is available in this JSbin project</a> )</p>
  
  <p><strong>However...</strong></p>
  
  <p>For some reason the value for the current current table's <code>division</code> property is not being recognized, or is simply not set when the filter is created (I'm not able to tell which is true), resulting in an empty 2nd dropdown (i.e. no valid filter).</p>
  
  <p>The error thus lies in the value binding of this single line of code:</p>
  
  <pre><code>filters: [new sap.ui.model.Filter("division", sap.ui.model.FilterOperator.EQ, "{tablemodel&gt;division}")]
  </code></pre>
  
  <p><strong>My question is:</strong></p>
  
  <ol>
  <li>Is it possible at all to have a filter setup this way in a table, i.e. setting a filter value for each row using data binding like <code>{tablemodel&gt;division}</code>? I know it works outside a table, but in this case the dropdown is a template with relative binding to the table data</li>
  <li>If not possible, how should I get it to work? I would suspect data binding should work implicitly, but for some reason it doesn't</li>
  </ol>
  
  <p><strong>Restrictions:</strong></p>
  
  <p>Ideally, I don't want to use an <code>onChange</code> event for the first dropdown, since the second dropdown should already be filtered based on the available table data, and not a selection-change made with the first dropdown.</p>
  
  <p>Any help will be greatly appreciated!</p>
  
  <p>=================================================</p>
  
  <p><strong>EDIT: I just tested with a page with nothing more than a single dropdown, and there it doesn't work either!...</strong></p>
  
  <p>If I use a filter where the filter value <code>value1</code> is specified by data binding:</p>
  
  <pre><code>new sap.ui.model.Filter({
      path     : "division", 
      operator : sap.ui.model.FilterOperator.EQ, 
      value1   : "{/someProperty}"
  })
  </code></pre>
  
  <p>then the dropdown does not render any items</p>
  
  <p>However, if I hardcode a value at property <code>value1</code>:</p>
  
  <pre><code>new sap.ui.model.Filter({
      path     : "division", 
      operator : sap.ui.model.FilterOperator.EQ, 
      value1   : "Test"
  })
  </code></pre>
  
  <p>Then the filter works as expected.</p>
  
  <p><strong>Bottomline:</strong></p>
  
  <blockquote>
    <p><em>Is it true we can't use data binding for specifying a filter value?</em></p>
  </blockquote>