Jquery TreeView - 将节点添加到异步树(PHP,Yii,MTreeView)

I'm building a PHP app using Yii and am using MTreeView (widget based on JQuery TreeView) via Ajax to display some hierarchical data. I have got lazy loading working well - when user clicks a plus sign the children are loaded via Ajax. The problem: the user can create items and I want those to be added to the tree without having to reload the page. I have found several examples of how to add items to a JQuery tree, but none of these seem to work for an async tree. Because some of the items added may have children, in those cases I want a plus sign to appear that, when clicked, triggers an Ajax request to load the children, like the other plus signs in the tree.

In this minimal example I have hard-coded the data to be displayed, but in the working app the data is coming from the database using ActiveRecord Models.

Controller:

public function actionajaxFillTree() {
    Yii::import('application.extensions.MTreeView.MTreeView');
    if (!Yii::app()->request->isAjaxRequest) {
        exit();
    }
    $parentId = $_GET['root'];
    $result = array();
    if ($parentId == 'source') {
        array_push($result, array('id' => '1', 'text' => 'text1', 'hasChildren' => 1));
        array_push($result, array('id' => '2', 'text' => 'text2', 'hasChildren' => 1));
        array_push($result, array('id' => '3', 'text' => 'text3', 'hasChildren' => 0));
    } elseif ($parentId == '1') {
        array_push($result, array('id' => '1-1', 'text' => 'text1-1', 'hasChildren' => 0));
        array_push($result, array('id' => '1-2', 'text' => 'text1-2', 'hasChildren' => 0));
    } elseif ($parentId == '2') {
        array_push($result, array('id' => '2-1', 'text' => 'text2-1', 'hasChildren' => 0));
    };
    echo str_replace(
            '"hasChildren":"0"', '"hasChildren":false', MTreeView::saveDataAsJson($result));
    exit();
 }

View:

 <?php $this->widget('application.extensions.MTreeView.MTreeView', array('url' => array('ajaxFillTree'),
'animated' => 'fast',
'htmlOptions' => array('id' => 'tree'),
    )); ?>

So far so good. Now suppose the user adds something to the database. I want this item to appear in the tree in the appropriate place. According to other examples on the web I can add items to the tree via javascript, like this:

(inside the view)

<button id="add">Add!</button> 
<script language="javascript" type="text/javascript">   
  $("#add").click(function() {
           var children = "<li>New Sublist<ul></ul>"; 
     children = $(children).insertAfter("#1-2");        
         $("#tree").treeview({
              add: children
         });               
});    

I noticed that I can add/remove <ul></ul> to make a plus sign appear/disappear, but that's a bit of a hack. I also noticed that clicking on this plus sign does not trigger ajax requests like the other tree items that have children nodes. I suppose it might be possible to add an onClick AJAX request to this somehow -- but there must be logic somewhere that creates the plus sign and tags it with the AJAX request, and I should be invoking whatever function does that instead of effectively reverse-engineering it with JavaScript. I can't make sense of the JQuery javascript code though -- over my head.

Thanks for any help.

I think I've solved it. via more thorough inspection of the html the TreeView is generating, I modified the above code as follows:

var children = "<li id='1-3' class='hasChildren expandable'>New Sublist<ul style='display: none; '><li class='last'><span class='placeholder'></span></li></ul>"; 

I'll leave this open in case anyone notices anything weird or wrong about the way I've been doing this, or in case I run into any issues implementing this.