Esempio n. 1
0
<?php

require_once '../include/header.php';
require_once '../lib/Kendo/Autoload.php';
?>

<?php 
$treeview = new \Kendo\UI\TreeView('treeview');
$treeview->attr('class', 'demo-section');
$treeview->template('#: item.text #' . '# if (!item.items) { #' . '<a class="delete-link" href="\\#"></a>' . '# } #');
// helper function that creates TreeViewItem with id and spriteCssClass
function TreeViewItem($id, $text, $spriteCssClass)
{
    $item = new \Kendo\UI\TreeViewItem($text);
    $item->spriteCssClass($spriteCssClass);
    $item->id = $id;
    return $item;
}
$documents = TreeViewItem(1, 'My Documents', 'rootfolder');
$documents->expanded(true);
$kendoproject = TreeViewItem(2, 'Kendo UI Project', 'folder');
$kendoproject->expanded(true);
$kendoproject->addItem(TreeViewItem(3, 'about.html', 'html'))->addItem(TreeViewItem(4, 'index.html', 'html'))->addItem(TreeViewItem(5, 'logo.png', 'image'));
$newsite = TreeViewItem(6, 'New Web Site', 'folder');
$newsite->expanded(true);
$newsite->addItem(TreeViewItem(7, 'mockup.jpg', 'image'))->addItem(TreeViewItem(8, 'Research.pdf', 'pdf'));
$reports = TreeViewItem(9, 'Reports', 'folder');
$reports->expanded(true);
$reports->addItem(TreeViewItem(10, 'February.pdf', 'pdf'))->addItem(TreeViewItem(11, 'March.pdf', 'pdf'))->addItem(TreeViewItem(12, 'April.pdf', 'pdf'));
$documents->addItem($kendoproject, $newsite, $reports);
$dataSource = new \Kendo\Data\HierarchicalDataSource();
Esempio n. 2
0
<?php

require_once '../include/header.php';
require_once '../lib/Kendo/Autoload.php';
?>

<?php 
$treeview = new \Kendo\UI\TreeView('treeview');
$treeview->attr('class', 'demo-section')->attr('style', 'width: 200px');
$treeview->dragAndDrop(true);
// build DataSource
$furniture = new \Kendo\UI\TreeViewItem('Furniture');
$furniture->expanded(true);
$furniture->addItem(new \Kendo\UI\TreeViewItem('Tables & Chairs'), new \Kendo\UI\TreeViewItem('Sofas'), new \Kendo\UI\TreeViewItem('Occasional Furniture'), new \Kendo\UI\TreeViewItem('Childerns Furniture'), new \Kendo\UI\TreeViewItem('Beds'));
$decor = new \Kendo\UI\TreeViewItem('Decor');
$decor->addItem(new \Kendo\UI\TreeViewItem('Bed Linen'), new \Kendo\UI\TreeViewItem('Throws'), new \Kendo\UI\TreeViewItem('Curtains & Blinds'), new \Kendo\UI\TreeViewItem('Rugs'), new \Kendo\UI\TreeViewItem('Carpets'));
$storage = new \Kendo\UI\TreeViewItem('Storage');
$dataSource = new \Kendo\Data\HierarchicalDataSource();
$dataSource->data(array($furniture, $decor, $storage));
$treeview->dataSource($dataSource);
// attach client-side events
$treeview->select("onSelect")->change("onChange")->collapse("onCollapse")->expand("onExpand")->dragStart("onDragStart")->drag("onDrag")->drop("onDrop")->dragEnd("onDragEnd")->navigate("onNavigate");
echo $treeview->render();
?>

<script>
    function onSelect(e) {
        kendoConsole.log("Selecting: " + this.text(e.node));
    }

    function onChange(e) {
Esempio n. 3
0
<?php

require_once '../include/header.php';
require_once '../lib/Kendo/Autoload.php';
?>

<div class="demo-section">
<?php 
$treeview = new \Kendo\UI\TreeView('treeview');
$treeview->attr('tabindex', '1')->attr('accesskey', 'w');
$furniture = new \Kendo\UI\TreeViewItem('Furniture');
$furniture->addItem(new \Kendo\UI\TreeViewItem('Tables & Chairs'), new \Kendo\UI\TreeViewItem('Sofas'), new \Kendo\UI\TreeViewItem('Occasional Furniture'), new \Kendo\UI\TreeViewItem('Childerns Furniture'), new \Kendo\UI\TreeViewItem('Beds'));
$decor = new \Kendo\UI\TreeViewItem('Decor');
$decor->expanded(true);
$decor->addItem(new \Kendo\UI\TreeViewItem('Bed Linen'), new \Kendo\UI\TreeViewItem('Throws'), new \Kendo\UI\TreeViewItem('Curtains & Blinds'), new \Kendo\UI\TreeViewItem('Rugs'), new \Kendo\UI\TreeViewItem('Carpets'));
$storage = new \Kendo\UI\TreeViewItem('Storage');
$storage->addItem(new \Kendo\UI\TreeViewItem('Wall Shelving'), new \Kendo\UI\TreeViewItem('Kids Storage'), new \Kendo\UI\TreeViewItem('Baskets'), new \Kendo\UI\TreeViewItem('Multimedia Storage'), new \Kendo\UI\TreeViewItem('Floor Shelving'), new \Kendo\UI\TreeViewItem('Toilet Roll Holders'), new \Kendo\UI\TreeViewItem('Storage Jars'), new \Kendo\UI\TreeViewItem('Drawers'), new \Kendo\UI\TreeViewItem('Boxes'));
$treeview->addItem($furniture, $decor, $storage);
echo $treeview->render();
?>
</div>

<ul class="keyboard-legend">
    <li>
        <span class="button-preview">
            <span class="key-button leftAlign wider">Alt</span>
            +
            <span class="key-button">w</span>
        </span>
        <span class="button-descr">
            focuses the widget
Esempio n. 4
0
        </li>
        <li>
            <input id="expand" name="animation" type="radio" checked="checked" />
            <label for="expand">expand animation</label>
        </li>
        <li>
            <input id="opacity" type="checkbox" checked="checked" />
            <label for="opacity">animate opacity</label>
        </li>
    </ul>
</div>

<div class="demo-section">
<?php 
$treeview = new \Kendo\UI\TreeView('treeview');
$treeview->attr('style', 'width: 200px;');
$furniture = new \Kendo\UI\TreeViewItem('Furniture');
$furniture->addItem(new \Kendo\UI\TreeViewItem('Tables & Chairs'), new \Kendo\UI\TreeViewItem('Sofas'), new \Kendo\UI\TreeViewItem('Occasional Furniture'), new \Kendo\UI\TreeViewItem('Childerns Furniture'), new \Kendo\UI\TreeViewItem('Beds'));
$decor = new \Kendo\UI\TreeViewItem('Decor');
$decor->expanded(true);
$decor->addItem(new \Kendo\UI\TreeViewItem('Bed Linen'), new \Kendo\UI\TreeViewItem('Throws'), new \Kendo\UI\TreeViewItem('Curtains & Blinds'), new \Kendo\UI\TreeViewItem('Rugs'), new \Kendo\UI\TreeViewItem('Carpets'));
$storage = new \Kendo\UI\TreeViewItem('Storage');
$storage->addItem(new \Kendo\UI\TreeViewItem('Wall Shelving'), new \Kendo\UI\TreeViewItem('Kids Storage'), new \Kendo\UI\TreeViewItem('Baskets'), new \Kendo\UI\TreeViewItem('Multimedia Storage'), new \Kendo\UI\TreeViewItem('Floor Shelving'), new \Kendo\UI\TreeViewItem('Toilet Roll Holders'), new \Kendo\UI\TreeViewItem('Storage Jars'), new \Kendo\UI\TreeViewItem('Drawers'), new \Kendo\UI\TreeViewItem('Boxes'));
$treeview->addItem($furniture, $decor, $storage);
echo $treeview->render();
?>
</div>

<script>
    $(document).ready(function() {
        var original = $("#treeview").clone(true);