Yii 表单未在 Javascript 中呈现

Question

我是 Yii 的新手，所以我不确定这是否是我的问题。

我正在尝试遍历呈现的远程搜索表单数组，并让内部HTML 根据用户选择的搜索类型的索引显示正确的表单。

每当我将 php 表单渲染到数组中时，我所有其他内部 HTML 对象都会停止出现。此外，表单本身不会出现。

当我在 HTML 中呈现表单时，它们没有问题，只有当我尝试在 Javascript 中呈现它们时才会出现问题。

有人可能对此有解决方案吗？

这是我的代码：

查看：

<div class="search-tabs-new animated fadeInUp">
<!-- Create select box for user to choose search method (by Person, Phone or Address) -->
<div class="home-search-custom-select">
  <ul class="home-search-method-options-list">
    <li id="home-search-by-btn">Search By...</li>
    <li class="home-search-method-option"></li>
    <li class="home-search-method-option"></li>
    <li class="home-search-method-option"></li>
  </ul>
</div>

<div id="home-search-form-area">
</div>

Javascript:

let methodTypes = [
  'Phone Number',
  'Name',
  'Address'
];

let homeSearchForms = [

  '<?= $this->render('/site/forms/phone_search', ['uri' => Url::to(['phone/process'])]); ?>',
  '<?= $this->render('/site/forms/person_search', ['uri' => Url::to(['people/process'])]); ?>',
  '<?= $this->render('/site/forms/address_search', ['uri' => Url::to(['address/process'])]); ?>'

];

let searchMethodOptions = document.querySelectorAll('.home-search-method-option');
searchMethodOptions = Array.from(searchMethodOptions);

function setSearchMethod() {
  for (var i = 0; i < searchMethodOptions.length; i++) {
    const searchMethodOption = searchMethodOptions[i];
    const methodType = methodTypes[i];
    const searchForm = homeSearchForms[i];

    searchMethodOption.innerHTML = methodType;

    searchMethodOption.addEventListener("click", function() {
        document.getElementById('home-search-form-area').innerHTML = searchForm;
    });

  }
}

setSearchMethod();

Answer 1

如果您渲染的HTML中有换行符，您应该删除那些

let homeSearchForms = [

  '<?= preg_replace( "/\r|\n/", "", $this->render('/site/forms/phone_search', ['uri' => Url::to(['phone/process'])])); ?>',
   ...

];

并确保在呈现的 HTML

中没有任何单引号

Yii 表单未在 Javascript 中呈现

Yii form not rendering in Javascript

javascript

php

yii

yii2