1.0.1 • Published 8 years ago

json-tabla v1.0.1

Weekly downloads
1
License
ISC
Repository
github
Last release
8 years ago

JSON to table.

Module to pass a JSON to table of HTML using JavaScript.

Description

To use this module has:

  function showData(div, json)

Where the first argument it receives is the id of the div to use, and the second argument is the required json displayed in a table.

This function is responsible for taking JSON data and incorporates them into an HTML table.

Implementation with web browser.

JSON structure:

var example = {
  users: [{
    name: "a",
    lastName: "b",
    address: "c",
    age: 18,
    email: "d",
    description: "e"
  }, {
    name: "b",
    lastName: "c",
    address: "d",
    age: 19,
    email: "e",
    description: "f"
  }]};

Table.html file:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example Table</title>
  <script src="json-table.js"></script>
</head>
<body>
  <div id="information"></div>
</body>
</html>

Open web browser console and run:

  showData("information", example);

Result:

Resultado


JSON to table

Módulo para pasar un JSON a una tabla de HTML utilizando JavaScript.

Descripción.

Para utilizar éste módulo se cuenta con la función:

  function showData(div, json)

Donde el primer argumento que recibe es el id del div a utilizar, y el segundo argumento es el json que se requiere mostrar en una tabla.

Ésta funcion se encarga de tomar los datos del JSON y los incorpora en una tabla de HTML.

Implementación con el navegador web.

Estructura del JSON:

var example = {
  users: [{
    name: "a",
    lastName: "b",
    address: "c",
    age: 18,
    email: "d",
    description: "e"
  }, {
    name: "b",
    lastName: "c",
    address: "d",
    age: 19,
    email: "e",
    description: "f"
  }]};

Archivo table.html:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example Table</title>
  <script src="json-table.js"></script>
</head>
<body>
  <div id="information"></div>
</body>
</html>

Abrir la consola del navegador web y ejecutar:

  showData("information", example);

Resultado:

Resultado