abodelot / Jquery.json Viewer
Licence: mit
jQuery plugin for displaying JSON data
Stars: ✭ 295
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Jquery.json Viewer
Tabulator
Interactive Tables and Data Grids for JavaScript
Stars: ✭ 4,329 (+1367.46%)
Mutual labels: json, jquery
Esp8266 Wifi Relay
simple sketch of using ESP8266WebServer to switch relays on GPIO pins. It serves a simple website with toggle buttons for each relay
Stars: ✭ 13 (-95.59%)
Mutual labels: json, jquery
Rest Api Examples
Test and Prototype with Fake Online REST/OAuth 2 APIs Examples
Stars: ✭ 13 (-95.59%)
Mutual labels: json, jquery
Funiture
慕课网课程推荐 Java并发编程与高并发解决方案：http://coding.imooc.com/class/195.html Java开发企业级权限管理系统：http://coding.imooc.com/class/149.html github: https://github.com/kanwangzjm/funiture, spring项目，权限管理、系统监控、定时任务动态调整、qps限制、sql监控(邮件)、验证码服务、短链接服务、动态配置等
Stars: ✭ 1,786 (+505.42%)
Mutual labels: json, jquery
Survey Library
JavaScript Survey and Form Library
Stars: ✭ 3,060 (+937.29%)
Mutual labels: json, jquery
React Docgen
A CLI and toolbox to extract information from React component files for documentation generation purposes.
Stars: ✭ 3,143 (+965.42%)
Mutual labels: json
Json To Go
Translates JSON into a Go type in your browser instantly (original)
Stars: ✭ 3,390 (+1049.15%)
Mutual labels: json
Yan
使用Maven构建，整合Dubbo+Zookeeper+SpringMVC+Spring+MyBatis+Redis支持分布式的高效率便捷开发框架
Stars: ✭ 293 (-0.68%)
Mutual labels: jquery
Stickystack.js
A jQuery plugin that creates a stacking effect by sticking panels as they reach the top of the viewport.
Stars: ✭ 287 (-2.71%)
Mutual labels: jquery
Sticky Kit
A jQuery plugin for creating smart sticky elements
Stars: ✭ 2,961 (+903.73%)
Mutual labels: jquery
Windows 95 Ui Kit
💾 Windows 95 UI Kit made with Bootstrap 4 components
Stars: ✭ 294 (-0.34%)
Mutual labels: jquery
jQuery json-viewer
json-viewer is a jQuery plugin for easily displaying JSON objects by transforming them into HTML.
Features:
- Syntax highlighting
- Collapse and expand child nodes on click
- Clickable links
- Easily readable and minimal DOM structure
Check out the demo page!
Install
Copy sources from git repository, or use npm:
npm install jquery.json-viewer
Make sure jQuery is already included. Then import jquery.json-viewer.js and jquery.json-viewer.css in your HTML document:
<head>
<script src="json-viewer/jquery.json-viewer.js"></script>
<link href="json-viewer/jquery.json-viewer.css" type="text/css" rel="stylesheet">
</head>
Usage
Call the jsonViewer() method on target element and pass your JSON data in argument:
<pre id="json-renderer"></pre>
var data = {
"foobar": "foobaz"
};
$('#json-renderer').jsonViewer(data);
Options
The jsonViewer method accepts an optional config object as a second argument. The supported options are:
-
collapsed(boolean, default:false): all nodes are collapsed at html generation. -
rootCollapsable(boolean, default:true): allow root element to be collasped. -
withQuotes(boolean, default:false): all JSON keys are surrounded with double quotation marks ({"foobar": 1}instead of{foobar: 1}). -
withLinks(boolean, default:true): all values that are valid links will be clickable, iffalsethey will only be strings.
Example:
$('#json-renderer').jsonViewer(data, {collapsed: true, withQuotes: true, withLinks: false});
About
- Author: Alexandre Bodelot
- License: MIT License
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].