jsontableify's Introduction

JSON to Table (HTML)

Install

npm install jsontableify

Include

const Jsontableify = require('jsontableify')

Features

toHTML(<json_object>): converts json to html code.
- Date (Configurable formatting)
- Links
- JSON arrays
- Labels get capitalized.
- Hide few labels from table.
- Replace text
- Define section headers / main json keys

Usage

const { html } = new Jsontableify({
  headerList: ['Phone', 'Attachments', 'PersonCompetency'], // optional - will be shown as header to table
  dateFormat: 'DD-MM-YYYY', // optional- date format to be converted to if date found
  replaceTextMap: { YearsOfExperience: 'Years Of Experience' }, // optional - key will be replaced by its value
  excludeKeys: ['Current CTC'], // optional - these fields will not be displayed
}).toHtml(<JSON object>)

Example

{
  "CandidateName": "Yatish Balaji",
  "YearsOfExperience": 3,
  "Current CTC": 10,
  "Expected CTC": 25.0,
  "Address": {
    "CountryCode": "India",
    "Leaving from": "12-11-2017",
    "Leaved Till": "2019-11-06T07:00:30.103Z"
  },
  "Phone": [
    {
      "Number": "8828558654",
      "Label": "personal",
      "Preferred": "primary"
    },
    {
      "Number": "8828558123",
      "Label": "official"
    }
  ],
  "PersonCompetency": [
    {
      "CompetencyName": "Java",
      "Synonyms": [
        "sr j2ee resource",
        "java stack",
        "jpa",
        "advance java"
      ]
    },
    {
      "CompetencyName": "AWS",
      "Synonyms": [
        "aws",
        "amazon webservice",
        "amazon web service"
      ]
    }
  ],
  "Attachments": {
    "type": "link",
    "value": [
      {
        "name": "Quezx Posh",
        "link": ["https://www.quezx.com/safeplace/"]
      },
      {
        "name": "Quezx Posh Attacment",
        "link": ["https://www.quezx.com/safeplace/"]
      }
    ]
  }
}

Output

HTML table

CSS for HTML code

https://github.com/yatishbalaji/jsontableify/blob/master/examples/toHtml.css

jsontableify's People

Contributors

Stargazers

Watchers

jsontableify's Issues

Does it support embed code in options?

I have searched and tried many libraries, and this is the best one I have found. Thank you for contributing this pack
But there is a problem. I want to embed the style or my code right into the options section. Can you edit and add this feature?

example:

new Jsontableify({
  headerList: ['Phone', 'Attachments', 'PersonCompetency'],
  dateFormat: 'DD-MM-YYYY',
  replaceTextMap: { YearsOfExperience: 'Years Of Experience' },
  excludeKeys: ['Current CTC'],
  embed: [
     "<link rel="stylesheet" type="text/css" href="sample.css">",
      "<script>console.log('hello world')</script>"
  ]
}).toHtml(json)