Question

在我的代码中，我通常使用一个静态的pjax容器名称，然后可以在我的beforeSubmit事件中使用以下内容。

$.pjax.reload({container:'#pjaxContainerName', timeout:5000, async:false});

但是，现在，pjax容器名称必须是动态的，我似乎无法获得上述行的正确语法。我正确检索了容器名称，但似乎无法传递它。以下是我的最新尝试

var pjaxContainer = $('#pjaxId').val();
$.pjax.reload({container:"#"+pjaxContainer, timeout:5000, async:false});

将pjaxContainer用作容器的正确方法是什么？

如果有更好的方法，我会全力以赴。我只需要在当前页面上重新加载pjax容器（此页面上只有1个）。

更新1

以下是我尝试失败的几次尝试

var pjaxContainerName = $('#pjaxId').val();
var pjaxContainer = $('#' + pjaxContainerName);
$.pjax.reload({
    // static pjax ids
    // *********************************
    // container: '#projectsListGrid', 
    // dynamic pjax ids
    // *********************************
    // container: "#"+pjaxContainer.attr('id'), //no error, but whole page reloads
    // container: pjaxContainerName, //uncaught exception: the container selector 'projectsListGrid5d2fa662b163c' did not match anything
    // container: "#"+pjaxContainerName, //no error, but whole page reloads
    // container: pjaxContainer, // uncaught exception: expected string value for 'container' option; got object
    // container: function(){ return '#'+pjaxContainerName; }, // uncaught exception: expected string value for 'container' option; got function
    timeout:5000,
    async:false
});

更新2

因此，我切换到使用会话变量将我的ID转移到我的模式_form，它的确生成具有正确pjax id的正确javascript代码，但是pjax重新加载会重新加载整个页面，而不仅仅是pjax容器。我一定在我的Pjax :: begin中缺少设置吗？谁能阐明这件事？

我已经搜索了我的html代码，并且所有ID都匹配

<div id="projectsListGrid5d2fc75ee5395" data-pjax-container="" data-pjax-timeout="9000" data-pjax="">
...
$.pjax.reload({container:'#projectsListGrid5d2fc75ee5395', timeout:9000, async:false});

但是它仍然会重新加载整个页面，我在这里想念什么？

下面是我从索引创建的Pjax容器

$pjaxContainerName = uniqid('projectsListGrid');
Pjax::begin([
        'id' => $pjaxContainerName,
        'enablePushState' => false,
        // 'enableReplaceState' => false,
        'options' => ['data-pjax' => true],
        'scrollTo' => false,
        'timeout' => 9000,
    ]);

Answer 1

我的建议是将数据属性添加到触发提交的元素，如下所示：

<?php foreach($boo as $foo): ?>
 <?php Pjax::begin([ 'id' => $foo->id ]); ?>
  <form>
   <input />
   <button type="submit" data-pajax-id="<?php echo $foo->id ?>" > Submit </button>
  </form>
 <?php Pjax::end(); ?>
<?php enforeach; ?>

然后在javascript中，每次提交后，您都要检查data-pajax-id

const idAjaxContainer = element.data('pajax-id')

提交完成后，您将触发重新加载：

$.pjax.reload({container: '#' + idAjaxContainer})

动态分配pjax容器

更新1

更新2

1 个答案: