1

我正在尝试实现这样的结果,即当用户单击链接时,会打开一个带有 html 的内联花式框。当用户输入一个值并点击输入时,它应该更新(淘汰)我的视图模型,并且花哨的盒子应该面向一个方向。

到目前为止,这是我的代码,我知道我需要重新应用 mybindings 但不知道如何。

HTML:

<div style="display:none">
        <div id="inlineManufacturerAdder">
            <div style="width:1000px;">
                <!-- In deze div alle content -->
                <h2>Add new Manufacturer2</h2>
                <p>

                    <form data-bind="submit: vm.addManufacturer">
                        <input type="text" data-bind="value: vm.newManufacturer, valueUpdate: 'afterkeydown'" placeholder="New Manufacturer">
                    </form>
                </p>
            </div>
        </div>
    </div>

Javascript(打字稿):

export function viewAttached() {
    $("a.fancybox-link-add-manufacturer").click(function (e) {
        $.fancybox({
            content: $('#inlineManufacturerAdder').html(), //this is where it goes wrong, it gets the content and forgets the bindings I guess!
            type: 'html'
        });
        return false;
    });
}

如果我以正常方式使用 div(设置为 display:none),那么没有fancybox,一切正常。

我应该怎么办?我正在使用杜兰达尔!

4

1 回答 1

1

您不需要重新应用绑定。只是不要传入innerHTML 内容,而是将元素节点(或jquery 实例)传入花哨的盒子。

例如:而不是:

content: $('#inlineManufacturerAdder').html()

做就是了:

content: $('#inlineManufacturerAdder')

[更新]

或者这些行很长的东西:

<a href="#inlineManufacturerAdder" class="fancybox-link-add-manufacturer" >Click me</a>
<div id="inlineManufacturerAdder" data-bind="html: msg"></div>

<script>
$(".fancybox-link-add-manufacturer").fancybox();
</script>

这里的例子:http: //jsfiddle.net/r83XF/2/

于 2013-03-21T11:20:09.620 回答