从木偶视图重新加载部分车把将无法访问为父视图中的部分模板元素定义的 ui 对象

Posted 2023-02-22

【中文标题】从木偶视图重新加载部分车把将无法访问为父视图中的部分模板元素定义的 ui 对象

【英文标题】：Reloading handlebars partial from marionette view loses access to ui object defined for partial template element within parent view

【发布时间】：2014-07-29 16:29:57

【问题描述】：

通过引用this 链接；我正在我的应用程序中从木偶视图重新加载车把部分模板。

在我的木偶视图中，我定义了 ui 对象如下

ui:             
        updateCarrierRow: ".hook--edit-carrier-row",
        dispatchEquipment: ".hook--dispatch-equipment",
        editButton: ".hook--edit-button",
        trailerText: "#trailer-text",
        tractorText: "#tractor-text"
    ,

trailerText 和 tractorText 变量引用了使用 Handlebars 表达式在当前视图的 html 模板中加载的把手模板中的元素

> dispatchedEquipement

应用程序用户将编辑使用此部分模板呈现的部分中的某些字段，因此提交给服务器的更改我需要使用父模型中的修改值重新加载此部分模板。

所以通过参考上面提到的链接，我已经使用以下代码段在父视图上重新加载了部分模板

this.ui.dispatchEquipment.empty().html(Handlebars.compileClean(dispatchEquipmentSectionPartial)(
                        "dispatchInformation": that.model.get("dispatchInformation"), "displayText": localizedText.displayText
                    ));

使用此代码，我已经成功地在我的父视图上重新加载了部分视图，但在随后的编辑操作中，当我尝试访问部分模板中的输入元素的值或尝试更改/添加 css 类时，它不适用于以下代码语句

this.ui.trailerText.val();

或

this.ui.tractorText.val();

尽管文本框包含正确的值，但它给了我空值。在父视图的 this.ui 对象的帮助下添加或删除这些元素的 css 类也会发生同样的情况

this.ui.tractorText.addClass("hidden")

不会向元素添加隐藏的 CSS 类。

到目前为止，我已经设法在 jQuery id 选择器的帮助下为这些元素工作。但我想知道我应该如何解决这个问题？ 提前致谢。

【参考方案1】：

我认为这是因为 ui 元素在视图初始化时绑定，但在视图的生命周期中，您清空并替换 html，从而不再将 ui 元素绑定到现在屏幕上的内容。

之后您可以尝试调用 this.bindUIElements() 但不能完全确定，因为我从来没有这样使用过它。