2013-02-20 2 views
0

Я использую JQuery плагин, treeTable для отображения таблицы html. http://ludo.cubicphuse.nl/jquery-plugins/treeTable/doc/ Мой код ниже:JQuery плагин treeTable: Не отображается правильно

<html> 
<head> 
<link href="treeTable/src/stylesheets/jquery.treeTable.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript" src="treeTable/src/javascripts/jquery.treeTable.js"></script> 

<script type="text/javascript" src="treeTable/doc/javascripts/jquery.js"></script> 
<script type="text/javascript" src="treeTable/doc/javascripts/jquery.ui.js"></script> 

<script> 

    $(document).ready(function() { 
    $('.type_struct_class').treeTable({ 
     initialState: 'collapsed' 
     }); 
    $('table#type_struct tbody tr').mousedown(function() { 
     $('tr.selected').removeClass('selected'); 
     $(this).addClass('selected'); 
    }); 
    $(\"table#type_struct tbody tr span\").mousedown(function() { 
     $($(this).parents(\"tr\")[0]).trigger(\"mousedown\"); 
    }); 





}); 
</script> 
</head> 
<body> 

<table class='type_struct_class' id='type_struct'> 
    <tr id="node-1"> 
    <td>Parent</td><td>100</td><td>1000</td> 
    </tr> 
    <tr id="node-2" class="child-of-node-1"> 
    <td>Child</td><td>200</td><td>2000</td> 
    </tr> 
    <tr id="node-3" class="child-of-node-2"> 
    <td>Child</td><td>300</td><td>3000</td> 
    </tr> 
</table> 

</body> 
</html> 

Я не вижу в таблице форматирования, как, как с детьми и родительских узлов. Он отображается как обычный стол в моем браузере Chrome. Может ли кто-нибудь помочь, где я ошибся?

ответ

0

Попробуйте это: - http://jsfiddle.net/adiioo7/6mtnL/

$(document).ready(function() { 
    $('.type_struct_class').treeTable({ 
     initialState: 'expanded' 
    }); 
    $('table#type_struct tbody tr').mousedown(function() { 
     $('tr.selected').removeClass('selected'); 
     $(this).addClass('selected'); 
    }); 
    $("table#type_struct tbody tr span").mousedown(function() { 
     $($(this).parents("tr")[0]).trigger("mousedown"); 
    }); 
}); 
+0

Да, я вижу, это то, что я хотел сделать. Однако то же самое не происходит в моем браузере. можете ли вы предложить, почему это так? В чем проблема? –

+0

имя и версия браузера? –

+0

Google Chrome Version 24.0.1312.57 –

1

Я нашел интеграции JQuery таблицы дерева и продуктов Atlassian сложной и написал совместимый клон сценария. Он также имеет вспомогательные функции для динамического создания таблиц: вы можете попробовать: http://culmat.github.io/jsTreeTable/

Смежные вопросы