1

所以我在一个 web 应用程序中同时使用了 knockoutjs (v 3.2.0) 和 fancyforms (v 1.4.2) 发现了以下问题：

我有两个select框（后面称为“下拉菜单”）和一个 html 页面上的两个链接。

现在所需的行为如下（只是一个简短的伪代码，请参见下面的 jsfiddle-scenarios）：

if(dropdown1.value == "a1"){
    dropdown2.value = "b3";
    dropdown2.hide()
    chosenlinkbutton = chosenlinkbutton1;
    chosenlinkbutton2.hide(); //realized via knockoutjs-visiblebinding and a param
} else {
    //show and reset stuff...
}

问题是：我的第二个下拉菜单没有被隐藏。相反，会出现另一个下拉菜单。当我调查这个问题时，我发现这是因为 fancyform 将实际的选择框转换为 ul/li-list 结构。但老实说，我不知道如何（重新）将我的绑定应用于生成的 fancyform 代码或在更改值后重新实例化 fancyform，所以我希望你能在这里帮助我。

JSFiddle 显示问题。只需将“weekView”更改为“monthView”即可查看其他下拉菜单不会消失：http: //jsfiddle.net/fnmav1e8/8/

还有一个带有注释掉的花式形式的工作 JSFiddle：http: //jsfiddle.net/fnmav1e8/7/

在这个版本中，我实际上只是注释掉了这一行

$("select").transformSelect();

但遗憾的是，我需要该应用程序与 fancyform 一起使用，所以我希望你们中的一些人能在这里帮助我！

最好的问候， 多米尼克

4

1 回答 1

2

像 Bootstrap 和 Fancy Forms 这样的 UI 工具包经常重写 DOM 以引入标准小部件的风格化版本。在 Knockout 中控制它们的可见性的技巧是将 Knockout 绑定放在小部件周围的容器上。

    <div data-bind="visible:isWeekView">
        <select id="selectCals" data-bind="value: mode">
            <option value="default">Default</option>
            <option value="defaultplus">Standard plus</option>
            <option value="none">nothing</option>
        </select>
    </div>

或者，您可以使用if绑定，它具有在虚拟标签中工作的优势。

于 2015-08-03T19:51:26.083 回答