CakePHP-如何拥有模态布局

我正在动态地将内容加载到我的modals中，通常它是一个在我的站点上已经是正常可访问页面的页面

因此，我希望能够重用该控制器/操作，并将其加载到我的模式中，但显然控制器已经使用了布局。因此，当我将页面加载到我的模式中时，我的站点的页眉和页脚都再次处于模式中，这是我不想要的

---

我想到的一个解决方案可能有效，但似乎是一个肮脏的解决办法，就是在我的Appcontroller中检查URL参数，该参数表示这是页面的模式调用（不是常规调用）。然后，它会用一个特殊的模式覆盖布局

//app_controller.php

public function beforeRender() {
    if (isset($this->params['passed']['_modal'])) {
        $this->layout = 'modal';
    }
}

// In my jQuery call to open the modal:

myModal.load('users/view/5/_modal').dialog('open');

然后在

modal.ctp

布局中，我将包含一个样式表，看起来像：

// modal_layout.css

@import url("normal_layout.css");

.header, .footer {display:none;}

因此，我不必重新定义所有常规布局的CSS，但我可以隐藏我不想显示的部分

---

这似乎是一种有点愚蠢的方法，我不知道它是否有效，但肯定有人以前用CakePHP做过这件事，你们有什么建议吗？

你们可以创建一个元素

$('#myModal').load("<?=url('users/view/5/_modal')?>", {type:'post'}, function(){
            $('#myModal').dialog({title:'open',autoOpen:false, modal:false, height:600, width:700});
            $('#myModal').dialog('open');
        });

function view($my_customer_id, action) {
//do stuff here 
$this->render(DS.'elements'.DS.'users'.DS.'modal');
}

$（'#myModal'）.load（“，{type:'post'}，function（）{
$（#myModal'）。对话框（{title:'open'，autoOpen:false，modal:false，高度：600，宽度：700}）；
$（'myModal'）。对话框（'open'）；
});
功能视图（$my\u customer\u id，action）{
//在这里做事
$this->render（DS.elements.DS.users.DS.modal'）；
}

使用RequestHandler检测ajax请求。将这一行放在操作的末尾：

if ($this->RequestHandler->isAjax())$this->render('view_name','ajax');

---

原来我不需要做这么复杂的事情。我只是在布局中创建了一个隐藏的div：

<div id="modal"></div>

通过这种方式，我可以将页面加载到模式中，但它仍然具有布局CSS中已定义的所有常规样式。页面通过使用其正常的CakePHP URL加载到模式中：

$('#modal').load('controller/action/param:whatever').dialog('open');

---

如果希望模态对话框的内容仅为操作视图的内容，则只需在控制器操作的顶部添加以下内容：

$this->layout = null;

这将禁用布局并输出视图的所有内容{html}

if ($this->request->is('ajax')) {
     $this->layout = 'ajax';            
}

---

现在，您可以根据需要配置布局/ajax.ctp。

但它不会请求布局、视图、CSS、JS等。即使它只是一个没有视图的ajax请求？是的，但我的布局包含样式表，它会使我视图中的内容看起来很好，与您访问该页面时通常所做的一样。这很公平。设置不同的布局就可以了。您也可以简单地从视图本身中引用css。

if ($this->request->is('ajax')) {
     $this->layout = 'ajax';            
}