Question

我继承了一个有点意大利面条编码的上传程序，它使用jsTree列出上传的文件。当您右键单击jsTree时，您会看到一个带有一些选项的选项框（上载文件，添加文件夹，删除文件夹等）。这些选项导致单独的页面。我想知道当你点击这些选项时，例如添加文件夹，它是否有可能触发模态弹出窗口，而不是转到单独的页面？

以下是我尝试使用的代码：

function buildTreeViewContextMenu(node)
{
    var items = {};
    if ($(node).attr('id') == 'trash')
    {
        <?php if($totalTrash > 0): ?>
        var items = {
            "Empty": {
                "label": "<?php echo t('empty_trash', 'Empty Trash'); ?>",
                "action": function(obj) {
                    confirmEmptyTrash();
                }
            }
        };
        <?php endif; ?>
    }
    else if ($(node).attr('id') == '-1')
    {
        var items = {
            "Upload": {
                "label": "<?php echo t('upload_files', 'Upload Files'); ?>",
                "separator_after": true,
                "action": function(obj) {

                    window.location='/';
                }
            },

            "Add": {
                "label": "<?php echo t('add_folder', 'Add Folder'); ?>",
                "action": function(obj) {                       
                    window.location='/view/folder/add?p='+obj.attr("id"); // this part I want to convert to a modal
                }
            }
        };

    }

例如，这是“添加文件夹”的模式：

<div class="panel-body">
            <!-- Modal -->
            <div class="modal fade" id="modalAddFolder" tabindex="-1" role="dialog" aria-labelledby="modalAddFolder" aria-hidden="true">
                    <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                        <h4 class="modal-title">Add Folder</h4>
                                </div>
                                <div class="modal-body">
                                    <?php require_once("folder/add.php"); ?>
                                </div>
                        </div>
                </div>
        </div>
        <!-- /Add Folder modal -->
    </div>
    <!-- /modal -->

我尝试使用this page，但无法将其整合。

Answer 1

想出来 - 希望这有助于其他人。这比我想象的要简单得多：

你可以用一些jQuery触发模态（我不知道为什么我不认为我不能混合javascript / jQuery - 也许这不是好习惯，但是现在，它可以工作。）

 "Add": {
        "label": "<?php echo t('add_folder', 'Add Folder'); ?>",
         "action": function(obj) {
           $('#modalAddFolder').modal('show'); 
           }
          },

与window.location不同，这个不会启动变量，但必要时可以轻松附加变量。

jsTree：用模态打开“添加文件夹”（或任何右键单击选项）

1 个答案: