День добрый!
Имеем такой код:
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
</head>
<body>
<div class="easyui-layout" style="width:800px;height:400px;">
<div region="west" split="true" title="Left" style="width:150px;">
<p style="padding:5px;margin:0;">Select:</p>
<ul>
<li><a href="javascript:void(0)" onclick="show_dg1()">Table 1</a></li>
<li><a href="javascript:void(0)" onclick="show_dg2()">Table 2</a></li>
<li><a href="javascript:void(0)" onclick="show_dg3()">Table 3</a></li>
</ul>
</div>
<div id="content" region="center" title="Center" style="padding:5px;"></div>
</div>
</div>
<script type="text/javascript">
function create_datagrid_1() {
$('#grid_1').datagrid({
url: "some url",
title: 'Table1',
singleSelect: 'true',
columns: [[
{field: 'id', title: 'ID', width : 100},
{field: 'Name', title: 'Name', width : 100, sortable:true}
]]
});
}
function create_datagrid_2() {
$('#grid_2').datagrid({
url: "some url",
title: 'Table2',
singleSelect: 'true',
columns: [[
{field: 'id', title: 'ID', width : 100},
{field: 'name, title: 'Name', width : 100, sortable:true}
]]
});
}
function create_datagrid_3() {
$('#grid_3').datagrid({
url: "some url",
title: 'Table3',
singleSelect: 'true',
columns: [[
{field: 'id', title: 'ID', width : 100},
{field: 'Name', title: 'Name', width : 100, sortable:true}
]]
});
}
</script>
</body>
</html>
Необходимо, что бы по клику на ссылку в отображались соответствующие таблицы. Как это можно сделать? Или для этого лучше использовать другой элемент?
