当前位置: 首页 > 工具软件 > jsoneditor > 使用案例 >

jsonEditor用法

隆扬
2023-12-01
<script type="text/javascript" src="resources/js/jsoneditor/jsoneditor.js?v=<%=WebResourcesVersion.JSONEDITOR%>"></script>
<link rel="stylesheet" type="text/css" href="resources/js/jsoneditor/jsoneditor.css?v=<%=WebResourcesVersion.JSONEDITOR%>"/>
//jsoneditor支持多种模式,modes: ['code', 'form', 'text', 'tree', 'view'], // allowed modes
//jsoneditor初始化,mode为tree时,显示结构树,为text时,默认显示为纯文本

function jsoneditorInit(){
    var container = document.getElementById('status'); 
    var options = {
            mode: 'tree',
            onError: function (err) {  
            alert(err.toString());
            }
    };
    jsonEditor = new JSONEditor(container, options, null); 
}

function checkStatus(serviceInstanceId) {
    superAjax({
        url : 'api/docker/service/status',
        data : {
            serviceInstanceId : serviceInstanceId
        },
        dataType : 'json',
        mask : true,
        success : function(data) {
            if(isEmpty(data)){
                $("#status").text("there is no status! sorry!");
            }else{
                // $("#status").text(data);
                jsonEditor.setText(data);
            }
        }
    });
}


//jsoneditor初始化,可以两种模式切换
function jsoneditorInit(){
    var container = document.getElementById('status'); 
    var options = {
            modes: ['tree','code'],
            onError: function (err) {  
            alert(err.toString());
            }
    };
    jsonEditor = new JSONEditor(container, options, null); 
}

function checkStatus(serviceInstanceId) {
    superAjax({
        url : 'api/docker/service/status',
        data : {
            serviceInstanceId : serviceInstanceId
        },
        dataType : 'json',
        mask : true,
        success : function(data) {
            if(isEmpty(data)){
                $("#status").text("there is no status! sorry!");
            }else{
                // $("#status").text(data);
                jsonEditor.setText(data);
            }
        }
    });
}
更多使用示例,可以查看官方示例: https://github.com/josdejong/jsoneditor/tree/master/examples
 类似资料: