Topic: import Json from Google Sheets & add hyperlinks in imported column

Mitchell Penning free asked 3 years ago


Hey Guys,

im trying out this tutorial - and have it working , https://mdbootstrap.com/snippets/jquery/ascensus/453950#js-tab-view $.getJSON("https://spreadsheets.google.com/feeds/list/1t2_HHLkibAybPORmXuDDEFEyetC3p7r1blQRpjzinXg/od6/public/values?alt=json", function (data) {

  var sheetData = data.feed.entry;

  var i;
  for (i = 0; i < sheetData.length; i++) {

    var name = data.feed.entry[i]['gsx$_cn6ca']['$t'];
    var age = data.feed.entry[i]['gsx$_cokwr']['$t'];
    var email = data.feed.entry[i]['gsx$_cpzh4']['$t'];

    document.getElementById('demo').innerHTML += ('<tr>'+'<td>'+name+'</td>'+'<td>'+age+'</td>'+'<td>'+email+'</td>'+'</tr>');

  }
});

I want to know how one would make the data in the last column clickable ( hyperlink) if it was a url instead of an email address..


Curreny free answered 3 years ago


Hi, hopefully a quick question: I'm having issues as the json level where gsx$_cn6ca, gsx$_cokwr and gsx$_cpzh4 for example isnt defined.

Its like this:

    "title": {
      "type": "text",
      "$t": "B1"
    },
    "content": {
      "type": "text",
      "$t": "Ticker"
    },

Where it should be like this:

    "title": {
      "type": "text",
      "$t": "John"
    },
    "content": {
      "type": "text",
      "$t": "_cokwr: 29, _cpzh4: john@gmail.com"

Could you please advice on what I should do


Grzegorz Bujański staff commented 3 years ago

Where this json file come from? Do you download it from a public server or do you have a configured backend and save the data yourself in the database and when you get it looks incorrect?


Grzegorz Bujański staff answered 3 years ago


You have to put the a tag there and fill in the href attribute:

document.getElementById('demo').innerHTML += (`
  <tr>
    <td>${name}</td>
    <td>${age}</td>
    <td><a href="${link}">${link}</a></td>
  </tr>
`);


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB Standard
  • MDB Version: 3.0.0
  • Device: laptop
  • Browser: chrome
  • OS: ubuntu
  • Provided sample code: No
  • Provided link: Yes