Yii renderPartial 与外部 javascript答案

【问题标题】：Yii renderPartial with external javascriptYii renderPartial 与外部 javascript
【发布时间】：2013-10-21 18:32:29
【问题描述】：

我有一个页面视图，它进行 ajax 调用并使用 renderPartial 更新页面内容。

所以 page.php -> _pagePartial.php（ajax 更新）

在 page.php 中我想包含一次 javascript 文件，然后在 ajax 渲染发生后应用 DOM 修改。在每次 AJAX 刷新时加载这个 JS 文件是没有意义的。

例如在page.php中

$baseUrl  = Yii::app()->baseUrl;
$basePath = Yii::app()->basePath;
$cs       = Yii::app()->getClientScript();
$cs->registerScriptFile($baseUrl . '/js/jquery.ui.js'); // load one time!

然后在pagePartial.php中

    // every ajax partial load
    $('#sortable-list-left').sortable({
                connectWith:'.productEntryCol',
                placeholder: 'ui-state-highlight',
                update: function(event, ui) {
                    var sortOrderLeft = getSortOrder('sortable-list-left');
                    var sortOrderRight = getSortOrder('sortable-list-right');
                    var projectId =  '" . $project_id . "';
                    $.ajax({
                        data: { left: sortOrderLeft, right : sortOrderRight,  id : projectId},
                        url: '/project/ajaxUpdateOrder',
                        type: 'POST',
                        success: function(response){
                          // process JSON response
                          var obj = jQuery.parseJSON(response);
                        }
                    });
                 }
            });

问题是通过 AJAX 加载 _pagePartial 后，它不能使用 .sortable() 方法。

处理这个问题的正确方法是什么？

谢谢

【问题讨论】：

标签： javascript php jquery yii renderpartial

【解决方案1】：

我处理这个问题的方法是在 $.load 或 $.ajax 的主视图上，或者在成功函数上添加你的代码。

例如：

$.get('_pagePartial.php', null, function(html) {
    $('#result').html(html);
    $('#sortable-list-left').sortable({
        //all your sortable code
    });
});

另一种选择是将您的 ajax 加载页面 ('_pagePartial.php') 上的 javascript 添加到如下函数中：

function firejs() {
    $('#sortable-list-left').sortable({
        //all your sortable code
    });
}

然后在主视图（'page.php'）上成功调用 ajax 时，只需添加：

$.get('_pagePartial.php', null, function(html) {
    $('#result').html(html);
    firejs();
});

在将对象添加到 DOM 之前，您可以绑定到对象，并且在 ajax 调用成功完成并将结果添加到 DOM 之前不会将其添加到 DOM。

还只是一个 FYI yii 内置了 jqueryui，你可以简单地说：

Yii::app()->clientScript->registerCoreScript('jquery.ui');
Yii::app()->clientScript->registerCoreScript('jquery');

【讨论】：

太棒了，我会测试一下。
似乎可以加载和使用大多数东西，但是 JQuery UI 可拖动项在每次页面加载时只工作一次，然后就不再工作，而实际上将 JS 放在 partialView 中它一直工作.
我想知道它是否与用于可拖动的 Jquery UI 键绑定的东西有关
您的 javascript 错误控制台中是否显示任何错误？
没有错误。我只是在想 JQueryUi 在页面加载时为可拖动元素做了某种键绑定，在 ajax 内容重新加载时不会刷新。

【解决方案2】：

对于像我这样有同样问题的人，即使是：

Yii::app()->clientscript->scriptMap['jquery.js'] = false;

在 renderPartial 中仍然无法正常工作。我找到了另一种解决方案，我认为更有效。最简单的办法就是设置renderPartial的第四个参数。

RenderPartial-detail

public string renderPartial(string $view, array $data=NULL, boolean $return=false, boolean $processOutput=false)

大约是processOutput。如果你把它设置为true，那么Jquery将被加载到你的渲染部分中。

希望这会对某人有所帮助...

【讨论】：