OctoberCMS 将变量 onStart 传递给 AJAX 函数

Question

我的主页包含以下代码：

function onStart()
{
  // ...
  // $result => Response of an API
  $this['prices'] = $prices;
}

function onAjax()
{
  // ...
  // $result => Response of another API
  $this['products'] = $products;
}

我的 AJAX 部分是：


{% for product in products %}

<div id="price">
  {{ prices[product.name] }}
</div>

{% endfor %}

但它无法读取 prices 变量。我怎样才能通过？

Answer 1

这是因为 onStart() 在页面创建时仅运行一次。您可以了解this here。它声明：“onStart 函数在页面执行开始时执行。”

要在部分代码中加载价格，您应该做的是将 onStart() 函数放在部分代码部分而不是页面中。

function onStart()
{
  // ...
  // $result => Response of an API
  $this['prices'] = $prices;
}

Answer 2

您可以简单地推送部分数据来更新部分。

参考：https://tutorialmeta.com/octobercms/october-cms-update-partial-using-ajax-framewrok

1.创建需要在 the theme's partial's directory 中更新的 partial。我们称它为 product-list.htm

<!-- here you can put condition if there is no product or there is no prices do not render anything and show message etc... -->
{% if products|length != 0 and prices|length != 0 %}
  {% for product in products %}
    <div id="price">
      {{ prices[product.name] }}
    </div>
  {% endfor %}
{% else %}
  <p>Please fetch from ajax</p>
{% endif %}

2。现在您需要在代码中使用该部分。在您的主页上.

在你的代码部分，你可以这样使用它。

function prepareVars() {
  // ...
  // $products => Response of another API
  // $prices => Response of another API


  // these are the variable will be available in the partial/page
  $this['prices'] = $prices;
  $this['products'] = $products;
}

function onStart()
{
  $this->prepareVars();
}

function onAjax()
{
  $this->prepareVars();
  return ['#partialId' => $this->renderPartial('product-list')];
}

在你的标记部分，你可以像这样使用它。

<div id="partialId">
 {% partial 'product-list' products=products %}
</div>

<button class="btn btn btn-primary" data-request="onAjax">
  Start Ajax
</button>

如何运作？

初始页面加载 onStart 将被调用，您可以获取产品或其他一些东西。并直接传递给部分并根据需要渲染该部分。
页面加载后，您单击 Start Ajax 按钮并进行 ajax call 此调用将调用 onAjax.
onAjax 处理程序将处理请求并获取 prices 并使用传递的数据再次呈现部分 ($this['variable_name']).
现在它将准备部分，然后我们将其推送到所需的 ID ('#partialId')，这样我们就可以更新我们的部分。

如有疑问请评论。

OctoberCMS 将变量 onStart 传递给 AJAX 函数

OctoberCMS pass variable onStart to AJAX function

octobercms