jQWidgets Forums
Forum Replies Created
-
Author
-
May 17, 2016 at 8:45 am in reply to: jqxTree data from,mysql can not work,pls help me!! jqxTree data from,mysql can not work,pls help me!! #84423
here is my code:
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
<html lang=”en”>
<head>
<meta http-equiv=”Content-Type” content=”text/html;charset=UTF-8″>
<title>tree</title>
<link rel=”stylesheet” href=”<?php echo ADMIN_CSS_URL;?>jqwidgets/styles/jqx.base.css” type=”text/css” />
<link rel=”stylesheet” href=”<?php echo ADMIN_CSS_URL;?>jqwidgets/styles/jqx.bootstrap.css” type=”text/css” />
<script type=”text/javascript” src=”<?php echo ADMIN_JS_URL;?>scripts/jquery-1.11.1.min.js”></script>
<script type=”text/javascript” src=”<?php echo ADMIN_JS_URL;?>scripts/demos.js”></script>
<script type=”text/javascript” src=”<?php echo ADMIN_JS_URL;?>jqwidgets/jqxcore.js”></script>
<script type=”text/javascript” src=”<?php echo ADMIN_JS_URL;?>jqwidgets/jqxbuttons.js”></script>
<script type=”text/javascript” src=”<?php echo ADMIN_JS_URL;?>jqwidgets/jqxscrollbar.js”></script>
<script type=”text/javascript” src=”<?php echo ADMIN_JS_URL;?>jqwidgets/jqxpanel.js”></script>
<script type=”text/javascript” src=”<?php echo ADMIN_JS_URL;?>jqwidgets/jqxtree.js”></script>
<script type=”text/javascript” src=”<?php echo ADMIN_JS_URL;?>qwidgets/jqxexpander.js”></script>
<script type=”text/javascript” src=”<?php echo ADMIN_JS_URL;?>jqwidgets/jqxsplitter.js”></script>
<style type=”text/css”>
html, body
{
height: 100%;
width: 100%;
margin: 0px;
padding: 0px;
overflow: hidden;
}
</style>
<script type=”text/javascript”>
$(document).ready(function() {
// Stuff to do as soon as the DOM is ready;
$(“#splitter”).jqxSplitter({ width: ‘100%’, height: ‘100%’, panels: [{ size: 250}] });
$(‘#jqxTree’).jqxTree({ height: ‘100%’, width: ‘100%’,theme:’bootstrap’ });
$(‘#jqxTree’).css(‘visibility’, ‘visible’);
// prepare the data
var source =
{
datatype: “json”,
datafields: [
{ name: ‘id’ },
{ name: ‘parentid’ },
{ name: ‘name’ }
],
url: ‘http://localhost/phperp/Home/Index/treedata’,
id: ‘id’,
async: false
};
var dataAdapter = new $.jqx.dataAdapter(source);
dataAdapter.dataBind();
var records = dataAdapter.getRecordsHierarchy(‘id’, ‘parentid’, ‘items’, [{ name: ‘name’, map: ‘label’}]);
$(‘#jqxTree’).jqxTree({ source: records, width: ‘100%’, height: ‘100%’});
$(‘#jqxTree’).on(‘select’, function (event) {
var args = event.args;
var item = $(‘#jqxTree’).jqxTree(‘getItem’, args.element);
$(“#ContentPanel”).html(“<div style=’margin: 10px;’>” + item.id + “</div>”);
});
});
</script></head>
<body class=’default’>
<div id=”splitter”>
<div>
<div style=”visibility: hidden; border: none;” id=’jqxTree’>
</div></div>
<div id=”ContentPanel”>
</div>
</div>
</body>
</html> -
AuthorPosts