Javascript 当选定项更改时是否替换嵌套的表单项？（Rails/AJAX/StimulusJS）

我有一个带有预填充嵌套表单的标准Rails应用程序。我在父模型上有一个选择，当用户更改嵌套项的上下文时，需要清除并重新填充它们

我一直在使用刺激物，想做这样的事情：

import { Controller } from "stimulus"

export default class extends Controller {

  static targets = [ "budgetCode", "body", "template" ]

  connect() {
  }

  budget_code_changed(event) {

    document.getElementById('budget_items').getElementsByTagName('tbody')[0].innerHTML = '';


    const url = '/budget_code_items/budget?budget_code_id=' + this.budgetCodeTarget.value;

    Rails.ajax({
      url: url,
      success: function(data) { 

        let row;
        var content = this.templateTarget.innerHTML
        for (let i = 0; i < data.length; i++) {
        this.bodyTarget.insertAdjacentHTML('beforeend', content)
          }

      }
    })

      }

 }

正如我用新的行结构定义的那样

我似乎遇到的问题是将刺激调用嵌入Rails.ajax函数中。我得到未捕获的TypeError:无法读取未定义错误的属性“innerHTML”。我确信这是一个可变范围类型的问题。Javascript不是我的强项，所以我怀疑我缺少了一些简单的小技巧

相关的次要问题：

同时，在我的一个模板列单元格中，我需要添加一些文本，并根据Rails.ajax调用上的数据设置隐藏输入的值。我很可能自己就能解决这个问题，但如果有人能增加这个问题，我将不胜感激。

您应该使用胖箭头来保留范围，以便

此

仍然指向控制器

Rails.ajax({
url:url，
键入：“GET”，
成功：（数据）=>{
//现在，这将保留到控制器
}
})

顺便说一下，您可以按如下方式传递参数

const url='/budget\u code\u items/budget'
Rails.ajax({
url:url，
键入：“GET”，
数据：“预算\代码\ id=”+this.budgetCodeTarget.value，
成功：（数据）=>{
}
})

---

请参阅更多详细信息，了解更多控制器代码结构。

Awesome-我想这就是这么简单的一件事。

    var content = this.templateTarget.innerHTML
    this.bodyTarget.insertAdjacentHTML('beforeend', content)