Search code examples
javascriptsapui5

Is there a way to dynamically get the specific binding of an sap.Table object?


I'm attempting to write a generic multi-use table filter/sorter. The current solution I have proposed requires being able to know the binding of the text property of a table's row. I can easily get the model that is bound to the table which then I can get all of the attributes of. But this doesn't say anything about the order of how the table displays the data in rows. This would ideally be done at any time. Not on something like row selection.

The closest I can get to getting the attribute is getting the already evaluated binding with this...

this.tableObject.getItems()[0].getCells()[0].getText()

This returns the actual value of the binding, not the binding itself.

and the path I can retrieve with something like

this.tableObject.getItems()[0].getBindingContextPath()

which returns the path "/Rowsets/Rowset/0/Row/0"

But this also fails when there is no data in the table.

The table is setup like this

<Table id="sap_Responsive_Page_0-content-build_simple_Table-1560756151819" 
width="auto" noDataText="No data" mode="None" showSeparators="All" growing="true" 
growingThreshold="20" growingScrollToLoad="true" class="sapUiResponsiveMargin" 
items="{path:'Model>/Rowsets/Rowset/0/Row', templateShareable:true}">

Then the rows are setup like this

<Text text="{Model>RESOURCE}" width="auto" maxLines="1" wrapping="false" textAlign="Begin" 
textDirection="Inherit" visible="true"/>

I expect/want {Model>RESOURCE} but instead receive the actual value TEST. Is there a different way to get this binding?


Solution

  • Try this code below, to get the binding context of each row.

    Without alias name model

    this.tableObject.getItems()[0].getBindingContext().getObject();
    

    With alias name model

    this.tableObject.getItems()[0].getBindingContext("<alias model name>").getObject();
    

    Dynamically get context of each row in a table

    We need to attach a press event, to get a dynamic binding context of each row in a table.


    View

     <Table>
        <columns>
            <Column>
                <Text text=""/>
            </Column>
    
        </columns>
        <items>
            <ColumnListItem vAlign="Middle" type="Navigation" press="onPressItemTable">
                <cells>
                    <Text text="{Model>RESOURCE}" width="auto" maxLines="1" wrapping="false" textAlign="Begin" textDirection="Inherit" visible="true"/>
                </cells>
            </ColumnListItem>
        </items>
    </Table>
    

    Controller

    onPressItemTable : function(oEvent) {
        console.info(`Binding context of selected row: ${oEvent.getSource().getBindingContext().getObject()}`);
    }