Making table elements (from JSON) linkable

Making table elements (from JSON) linkable

TsardinesTsardines Posts: 10Questions: 4Answers: 0
edited January 2019 in Free community support

Hi---I have a JSON file that contains document titles and a URL for each. So far I've been able to render each document into my table. I also rendered each url into the first table row as a test. It was good that they appeared but it's not what I'm going for.

How can I make it so that each document title is linked with its respective URL? I didn't see any info. about it in the manual or the forum so I thought I'd ask.

If you'd like to see a snippet of the JSON file, please let me know.

JS snippet:

import $ from 'jquery';

import JSONfile from '../../../public/JSONfile.json';
import { basename } from 'path';

import dt from 'datatables.net';`

var tableRes = '';

    export default class {
        constructor() {
            this.loadData();
            this.loadTableData();
        }

 loadTableData() {
    $.noConflict();
    let tableRes = JSONfile.d.results.filter(function(val) { 
      return (val.FileLeafRef.trim().length > 0);
    }).map(function(obj) {

      return {
        // "FileName": obj.FileLeafRef,
        // "Path": obj.EncodedAbsUrl, ///// these are the URLs for each document
        "Titles": obj.File.Name
        }
      });

    $('#km-table-id').DataTable( {
      columns: [
        { "data": " " },
        { "data": "Titles" }, ///// Ideally I want each Title to be linked in the table---i.e. the document names appearing blue
        { "data": " " }
      ],
      data: tableRes,
      "pagingType": "full_numbers"
    });

 }

}

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 21,309Questions: 26Answers: 4,947
    Answer ✓

    You would use columns.render for this. The docs have an example of creating a link from the data.

    Kevin

  • TsardinesTsardines Posts: 10Questions: 4Answers: 0

    Great! I was able to add Download links in the next column over and downloaded a document as a test.

This discussion has been closed.