Adding sort functionality on every column in SAPUI5 table

Question

I want to add functionality on every column of my table in which click on the column sorts that in some order (ascending/descending). But there is no click event on the column. An icon should appear on every column and by clicking the column it should open a dialog where sorting options will be given

<Table id="schTableId" selectionChange="onTableRowPress" 
mode="SingleSelectMaster" growingScrollToLoad="true" growingThreshold="10"
            growing="true">
            <columns>
                <Column >
                    <Text text="Sales Order No." class="ABC"/>
                </Column>
                <Column >
                    <Text text="Creation Date" class="ABC"/>
                </Column>
                <Column minScreenWidth="Tablet" demandPopin="true">
                    <Text text="Requested Delivery Date" class="ABC"/>
                </Column>
                <Column minScreenWidth="Tablet" demandPopin="true">
                    <Text text="Sold-To-Party" class="ABC"/>
                </Column>
                <Column minScreenWidth="Tablet" demandPopin="true">
                    <Text text="Ship-To-Party" class="ABC"/>
                </Column>
                <Column minScreenWidth="Tablet" demandPopin="true" width="8em">
                    <Label design="Bold" text="Product"/>
                </Column>
                <Column minScreenWidth="Tablet" demandPopin="true">
                    <Text text="Quantity" class="ABC"/>
                </Column>
                <Column minScreenWidth="Tablet" demandPopin="true">
                    <Text text="TT No." class="ABC"/>
                </Column>
                <Column minScreenWidth="Tablet" demandPopin="true">
                    <Text text="Invoice No." class="ABC"/>
                </Column>
                <Column minScreenWidth="Tablet" demandPopin="true">
                    <Text text="Invoice Date" class="ABC"/>
                </Column>
                <Column minScreenWidth="Tablet" demandPopin="true">
                    <Text text="Bill Amount" class="ABC"/>
                </Column>
                <Column minScreenWidth="Tablet" demandPopin="true">
                    <Text text="Status" class="ABC"/>
                </Column>
            </columns>
            <items>
            </items>
        </Table>

Answer 1

You can make use of "header" aggregation in sap.m.Column control (it's a default one). You can put HBox there, including Text for showing the actual column header and a Button with a sorting icon, clicking on which changes the sorting order and modify the icon direction.

https://sapui5.netweaver.ondemand.com/sdk/#/api/sap.m.Column