0

在我的代码中,我通常有一个静态 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,
    ]);
4

1 回答 1

0

我的建议是向触发提交的元素添加一个数据属性,如下所示:

<?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})
于 2019-07-18T07:50:01.307 回答