Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

176
Views
How to create links on the column of table in SAPUI5

Could anyone please give me some idea how to create links on table column contents (only for two columns) and this contents are coming from ODATA service and after pressing any content it should go to the particular link?

Ex. Suppose the every table content has {mainUrl} and

For 1st column: Deep Link: /bb/ccc/eee?reqid = Example URL: {mainUrl}/bb/ccc/eee?reqid=6000

For 2nd column: Deep Link: /bb/cc/fff?jobid= Example: {mainUrl}/bb/cc/fff?jobid=4000

I tried couple of the examples: ex-1, ex-2. But I'm not sure how to fix it for this case. I'd really appreciate if you could provide me some example codes if it's possible.

Thanks in advance.

about 4 years ago · Juan Pablo Isaza
2 answers
Answer question

0

A simple example how to create links on table columns is based on Link - Subtle example.

  1. In the /mockdata/products.json for each 'ProductPicUrl' field value remove a host name 'https://openui5.hana.ondemand.com'.

  2. As a result the link in the column has got a host of the dev server, eg is 'http://localhost:8081/test-resources/sap/ui/documentation/sdk/images/HT-2001.jpg'

  3. In the Link.view.xml view change the first column content by adding a formatter function see Walkthrough Step 22: Custom Formatters:

    <ColumnListItem>
      <Link
        text="{Name}"
        href="{
          path: 'ProductPicUrl',
          formatter: '.hrefFormatter'
        }" />
    
  4. And implement the formatter in the Link.view.xml controller file:

    hrefFormatter: function(sUrl) {
        var mainUrl = 'https://openui5.hana.ondemand.com';
        return mainUrl + sUrl;
    }
    
  5. Using the formatter provides modified link URL: 'https://openui5.hana.ondemand.com/test-resources/sap/ui/documentation/sdk/images/HT-1002.jpg'

about 4 years ago · Juan Pablo Isaza Report

0

I've solved this by writing the codes in JS file:

createAllColumns: function () {
.....
.....
 var oTemplate = new Text({
                        text: sText,
                        wrapping: false
                    }); // for default columns

                    if (oChar.charId === "columnID") {
                        oTemplate = new Link({
                            text: sText,
                            press: this.readTheID
                        });
                    }
......
......
},

readTheID: function (oEvent) {
            const oBind = oEvent.getSource().getParent().getBindingContext("service name");
            const obj = oBind.getObject().columnID;
            const value = oEvent.getSource().getProperty("text");

            return models.getInstance().getOdataWrapper().getEntitySet({
                path: "/OdataServiceEntitySet",
                filters: [new Filter({ path: "name", operator: FilterOperator.EQ, value1: "mainUrl" }),
                new Filter({ path: "columnID", operator: FilterOperator.EQ, value1: obj })],
                And: true
            }).then((odata) => {
                if (odata.length > 0) {
                    var mainLink = odata[0].getObject().value;
                    sap.ui.require([
                        "sap/m/library"
                    ], sapMLib => sapMLib.URLHelper.redirect(mainLink + "/bb/ccc/eee?reqid=" + value, /*new window*/true));
                }
            }).catch((err) => {
                sap.m.MessageToast.show("Failed");
            });

        },
 

Note: "sap/m/Link" produces dynamic links. In that case we can't reserve the links into the column contents, that's why user can't copy the link directly from the content.

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!