2015-02-28 04:54:04 +08:00
|
|
|
<!DOCTYPE HTML>
|
2012-04-21 19:28:28 +08:00
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<title>CouchDB Document Editor</title>
|
|
|
|
|
|
|
|
|
|
<meta name="description" content="CouchDB Document Editor">
|
|
|
|
|
<meta name="keywords" content="json, editor, couchdb, online, javascript, javascript object notation, treeview, open source, free">
|
|
|
|
|
<meta name="author" content="Jos de Jong">
|
|
|
|
|
|
2012-11-01 05:16:07 +08:00
|
|
|
<link rel="shortcut icon" href="../app/web/favicon.ico">
|
2012-04-21 19:28:28 +08:00
|
|
|
|
2015-02-28 04:54:04 +08:00
|
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
|
|
|
|
|
<script src="../jsoneditor/js/jsoneditor.js"></script>
|
2013-01-02 03:54:07 +08:00
|
|
|
<link rel="stylesheet" type="text/css" href="../jsoneditor/css/jsoneditor.css">
|
2012-04-21 19:28:28 +08:00
|
|
|
|
|
|
|
|
<style type="text/css">
|
|
|
|
|
body, html {
|
|
|
|
|
font-family: arial, verdana;
|
|
|
|
|
font-size: 11pt;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
margin: 0px;
|
|
|
|
|
padding: 0px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
h1 {
|
|
|
|
|
color: gray;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
input[type=text] {
|
|
|
|
|
border: 1px solid gray;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
2015-02-28 04:54:04 +08:00
|
|
|
<script>
|
2012-04-21 19:28:28 +08:00
|
|
|
var editor = null;
|
|
|
|
|
|
|
|
|
|
function init() {
|
|
|
|
|
var container = document.getElementById('jsoneditor');
|
2014-05-30 04:13:37 +08:00
|
|
|
editor = new JSONEditor(container);
|
2012-04-21 19:28:28 +08:00
|
|
|
|
|
|
|
|
document.getElementById('url').focus();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function load() {
|
|
|
|
|
var url = document.getElementById("url").value;
|
|
|
|
|
$.ajax({
|
|
|
|
|
'type': 'GET',
|
|
|
|
|
'url': url,
|
|
|
|
|
'dataType': 'json',
|
|
|
|
|
'success': function (doc) {
|
|
|
|
|
editor.set(doc);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function save() {
|
|
|
|
|
var doc = editor.get();
|
|
|
|
|
var url = document.getElementById("url").value;
|
|
|
|
|
$.ajax({
|
|
|
|
|
'type': 'PUT',
|
|
|
|
|
'url': url,
|
|
|
|
|
'data': JSON.stringify(doc),
|
|
|
|
|
'success': function (response) {
|
|
|
|
|
load();
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body onload="init();">
|
|
|
|
|
|
|
|
|
|
<table align="center" width="790px" height="100%">
|
|
|
|
|
<tr>
|
|
|
|
|
<td style="height: 50px;"><h1>CouchDB Document Editor</h1></td>
|
|
|
|
|
</tr>
|
|
|
|
|
<tr>
|
|
|
|
|
<td style="height: 30px;">
|
|
|
|
|
<table width="100%">
|
|
|
|
|
<col width="100px"></col>
|
|
|
|
|
<col ></col>
|
|
|
|
|
<col width="50px"></col>
|
|
|
|
|
<col width="50px"></col>
|
|
|
|
|
<tr>
|
|
|
|
|
<td>Document Url:</td>
|
|
|
|
|
<td><input type="text" id="url" style="width: 100%;" value="http://localhost:5984/test/jos"></td>
|
|
|
|
|
<td><input type="button" value="Load" onclick="load();" /></td>
|
|
|
|
|
<td><input type="button" value="Save" onclick="save();" /></td>
|
|
|
|
|
</tr>
|
|
|
|
|
</table>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
<tr>
|
|
|
|
|
<td id="jsoneditor"></td>
|
|
|
|
|
</tr>
|
|
|
|
|
</table>
|
|
|
|
|
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
