Browse Source

format edit页逻辑

v1
段少珍 3 years ago
parent
commit
7aafdb6c08
  1. 6
      controllers/FormatController.go
  2. 22
      static/jsonform/playground/editground.js
  3. 4
      views/format/edit.html
  4. 96
      views/format/footerjs_edit.html

6
controllers/FormatController.go

@ -13,7 +13,13 @@ type FormatController struct {
}
func (c *FormatController) Edit() {
midvalue, _ := c.GetInt("mid")
menu := models.MenuModel{Mid: midvalue}
o := orm.NewOrm()
o.Read(&menu)
c.Data["Mid"] = c.GetString("mid")
c.Data["Format"] = menu.Format
c.LayoutSections = make(map[string]string)
c.LayoutSections["footerjs"] = "format/footerjs_edit.html"
c.setTpl("format/edit.html", "common/layout_edit.html")

22
static/jsonform/playground/editground.js

@ -26,17 +26,10 @@ $('document').ready(function () {
/**
* Loads and displays the example identified by the given name
*/
var loadExample = function () {
$.ajax({
url: '/static/jsonform/playground/examples/gettingstarted.json',
dataType: 'text'
}).done(function (code) {
var aceId = $('#form .ace_editor').attr('id');
var editor = ace.edit(aceId);
editor.getSession().setValue(code);
}).fail(function () {
$('#result').html('Sorry, I could not retrieve the example!');
});
var loadExample = function (fmtjson) {
var aceId = $('#form .ace_editor').attr('id');
var editor = ace.edit(aceId);
editor.getSession().setValue(fmtjson);
};
@ -96,11 +89,4 @@ $('document').ready(function () {
// Render the form
$('#form').jsonForm(formObject);
// Wait until ACE is loaded
var itv = window.setInterval(function() {
if (window.ace) {
window.clearInterval(itv);
loadExample();
}
}, 1000);
});

4
views/format/edit.html

@ -63,7 +63,7 @@
<input type="text" name="Mid" lay-verify="title" autocomplete="off" placeholder="" class="layui-input">
</div>
</div>
<div><a href="/format/examples" target="_black">示例</a></div>
<div class="layui-form-item">
<div class="layui-input-inline">
<button class="layui-btn" lay-submit lay-filter="demo1">保存表单</button>
@ -97,7 +97,7 @@
<script src="/static/jsonform/lib/jsonform.js"></script>
<script src="/static/jsonform/playground/editground.js"></script>
</body>

96
views/format/footerjs_edit.html

@ -30,3 +30,99 @@ layui.use(['form'], function(){
});
</script>
<script>
/*global $, ace, console*/
$('document').ready(function () {
var formObject = {
schema: {
greatform: {
title: 'JSON Form object to render',
type: 'string'
}
},
form: [
{
key: 'greatform',
type: 'ace',
aceMode: 'json',
width: '100%',
height: '' + (window.innerHeight - 140) + 'px',
notitle: true,
onChange: function () {
generateForm();
}
}
]
};
/**
* Displays the form entered by the user
* (this function runs whenever once per second whenever the user
* changes the contents of the ACE input field)
*/
var generateForm = function () {
var values = $('#form').jsonFormValue();
// Reset result pane
$('#result').html('');
// Parse entered content as JavaScript
// (mostly JSON but functions are possible)
var createdForm = null;
try {
// Most examples should be written in pure JSON,
// but playground is helpful to check behaviors too!
eval('createdForm=' + values.greatform);
}
catch (e) {
$('#result').html('<pre>Entered content is not yet a valid' +
' JSON Form object.\n\nJavaScript parser returned:\n' +
e + '</pre>');
return;
}
// Render the resulting form, binding to onSubmitValid
try {
createdForm.onSubmitValid = function (values) {
if (console && console.log) {
console.log('Values extracted from submitted form', values);
}
window.alert('Form submitted. Values object:\n' +
JSON.stringify(values, null, 2));
};
createdForm.onSubmit = function (errors, values) {
if (errors) {
console.log('Validation errors', errors);
return false;
}
return true;
};
$('#result').html('<form id="result-form" class="form-vertical"></form>');
$('#result-form').jsonForm(createdForm);
}
catch (e) {
$('#result').html('<pre>Entered content is not yet a valid' +
' JSON Form object.\n\nThe JSON Form library returned:\n' +
e + '</pre>');
return;
}
};
// Render the form
$('#form').jsonForm(formObject);
});
// Wait until ACE is loaded
var itv = window.setInterval(function() {
if (window.ace) {
window.clearInterval(itv);
var aceId = $('#form .ace_editor').attr('id');
var editor = ace.edit(aceId);
editor.getSession().setValue({{.Format}});
}
}, 2000);
</script>

Loading…
Cancel
Save