Jquery TreeView-将节点添加到异步树（PHP、Yii、MTreeView）

我正在使用Yii构建一个PHP应用程序，并通过Ajax使用MTreeView（基于jquerytreeview的小部件）来显示一些层次数据。我的惰性加载工作得很好——当用户单击加号时，子项通过Ajax加载。问题是：用户可以创建项目，我希望这些项目可以添加到树中，而无需重新加载页面。我发现了几个如何向JQuery树添加项的示例，但这些示例似乎都不适用于异步树。因为添加的某些项可能有子项，在这种情况下，我希望在单击时显示一个加号，它会触发Ajax请求以加载子项，就像树中的其他加号一样

在这个最小的示例中，我硬编码了要显示的数据，但在工作应用程序中，数据来自使用ActiveRecord模型的数据库

控制器：

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();
 }

视图：

到目前为止还不错。现在假设用户向数据库添加了一些内容。我希望此项显示在树中的适当位置。根据web上的其他示例，我可以通过javascript将项目添加到树中，如下所示：

（视图内）

添加！
$（“#添加”）。单击（函数（）{
var children=“
新子列表
”；
children=$（children）.插入后面（#1-2”）；
$（“#树”）.treeview({
加：儿童
});               
});    

我注意到我可以添加/删除

以使加号出现/消失，但这有点麻烦。我还注意到，单击这个加号不会像其他具有子节点的树项目那样触发ajax请求。我认为可能会以某种方式向其添加onClick AJAX请求——但必须有某种逻辑在某处创建加号并用AJAX请求标记它，我应该调用执行该操作的任何函数，而不是使用JavaScript对其进行有效的反向工程。不过，我无法理解JQuery javascript代码——我简直无法理解

---

谢谢你的帮助。

我想我已经解决了。通过更彻底地检查TreeView生成的html，我修改了上述代码，如下所示：

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

var children=“
新子列表
”；

如果有人注意到我做这件事的方式有任何奇怪或错误，或者我在实现这件事时遇到任何问题，我会把它打开

<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
         });               
});    

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