2
Я работаю над Jstree с плагином контекстного меню, но есть несколько проблем.JQuery JsTree: jstree неправильно отображается в браузере
Вот как мое дерево получает визуализацию в браузере (проверяется как на хроме, так и на мозилле).
, но я хочу, чтобы мой jstree быть как этотhttp://jsfiddle.net/govi20/cnbsfkx8/1/
Существует не одна ошибка на chromeDev консоли, а также поджигатель консоли.
HTML наценка
<link href="http://medialize.github.io/jQuery-contextMenu/src/jquery.contextMenu.css">
<link href="rhttp://static.jstree.com/3.0.8/assets/dist/themes/default/style.min.css">
<link href="http://static.jstree.com/3.0.8/assets/bootstrap/css/bootstrap.min.css">
</head>
<body>
<div id="jstree1">
</div>
</body>
<script type="text/javascript">
function demo_create() {
var ref = $('#jstree1').jstree(true),
sel = ref.get_selected();
if(!sel.length) { return false; }
sel = sel[0];
sel = ref.create_node(sel, {"type":"file"});
if(sel) {
ref.edit(sel);
}
};
function demo_rename() {
var ref = $('#jstree1').jstree(true),
sel = ref.get_selected();
if(!sel.length) { return false; }
sel = sel[0];
ref.edit(sel);
};
function demo_delete() {
var ref = $('#jstree1').jstree(true),
sel = ref.get_selected();
if(!sel.length) { return false; }
ref.delete_node(sel);
};
function getJSON() {
// var v = $('#data').jstree(true).get_json('#', {flat:true});
var v = $('#jstree1').jstree(true).get_json('#', { 'flat': true });
var mytext = JSON.stringify(v);
console.log("tree=> "+mytext);
}
$(document).ready(function(){
$('#jstree1').jstree({
"core" : {
"check_callback" : true,
"themes": {
"name": "default-dark",
"dots": true,
"icons": true
},
"themes" : {
"theme" : "apple"
},
'data' : [
'Simple root node',
{
'id' : 'node_2',
'text' : 'Root node with options',
'state' : { 'opened' : true, 'selected' : true },
'children' : [ { 'text' : 'Child 1' }, 'Child 2']
}
]
},
"plugins" : [ "themes","contextmenu","dnd" ]
});
});
</script>
<script src="http://code.jquery.com/jquery-1.11.0.js"></script>
<script src="http://static.jstree.com/3.0.8/assets/dist/jstree.min.js"></script>
<script src="http://medialize.github.io/jQuery-contextMenu/src/jquery.contextMenu.js"></script>
<script type="text/javascript">
function demo_create() {
var ref = $('#jstree1').jstree(true),
sel = ref.get_selected();
if(!sel.length) { return false; }
sel = sel[0];
sel = ref.create_node(sel, {"type":"file"});
if(sel) {
ref.edit(sel);
}
};
function demo_rename() {
var ref = $('#jstree1').jstree(true),
sel = ref.get_selected();
if(!sel.length) { return false; }
sel = sel[0];
ref.edit(sel);
};
function demo_delete() {
var ref = $('#jstree1').jstree(true),
sel = ref.get_selected();
if(!sel.length) { return false; }
ref.delete_node(sel);
};
function getJSON() {
// var v = $('#data').jstree(true).get_json('#', {flat:true});
var v = $('#jstree1').jstree(true).get_json('#', { 'flat': true });
var mytext = JSON.stringify(v);
console.log("tree=> "+mytext);
}
$(document).ready(function(){
$('#jstree1').jstree({
"core" : {
"check_callback" : true,
"themes": {
"name": "default-dark",
"dots": true,
"icons": true
},
"themes" : {
"theme" : "apple"
},
'data' : [
'Simple root node',
{
'id' : 'node_2',
'text' : 'Root node with options',
'state' : { 'opened' : true, 'selected' : true },
'children' : [ { 'text' : 'Child 1' }, 'Child 2']
}
]
},
"plugins" : [ "themes","contextmenu","dnd" ]
});
});
</script>
пожалуйста предложить мне изменения.
Пожалуйста, вы можете сказать мне, как вы хотите, чтобы ваш выход должен быть? –
моя проблема с GUI i.e CSS. 1) проверьте этот http://jsfiddle.net/govi20/cnbsfkx8/1/, он показывает дерево с иконкой папки и т. Д. 2) и теперь проверьте изображение в моем вопросе. JSFiddle отображает его правильно, но браузер не отображает его правильно. – piechuckerr
Я не понимаю, какой графический выход вы требуете. Пожалуйста, дайте мне некоторое изображение требуемого выхода. –