Повторно применить привязки после Fancybox с нокаутом

Я пытаюсь добиться того, что когда пользователь щелкает ссылку, открывается встроенный fancybox с html. Когда пользователь вводит значение и нажимает ввод, оно должно обновить (отключить) мою модель представления, и причудливая коробка должна быть обращена в сторону.

Пока это мой код, я знаю, что мне нужно повторно применить мои привязки, но не могу понять, как это сделать.

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 все работает нормально.

Что я должен делать? Я использую Дюрандаль!


javascript html knockout.js durandal fancybox-2
person Leroy Meijer    schedule 21.03.2013    source источник
comment
Я знаю, что не отвечаю на ваш вопрос, но почему вы пытаетесь использовать fancybox? Durandal имеет функции для отображения модальных диалогов и даже документацию, показывающую, как изменить вид ( durandaljs.com/documentation/Showing-Message-Boxes-And-Modals), что вам нужно от fancybox, чего нельзя сделать с durandal?   -  person Julián Yuste    schedule 21.03.2013

Ответы (1)


arrow_upward
1
arrow_downward

Вам не нужно повторно применять привязки. Просто не передавайте содержимое 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/

person badsyntax    schedule 21.03.2013
comment
Если я это сделаю, мой машинописный текст больше не будет компилироваться. Он говорит: Предоставленные параметры не соответствуют ни одной подписи цели вызова. postimg.org/image/wu0rfagd3 - person Leroy Meijer; 21.03.2013
comment
Извините, это не помогло, потому что, если у ссылки есть href, она отправляется обратно домой! --› stackoverflow.com/questions/15503981/ - person Leroy Meijer; 21.03.2013
comment
Вы неправильно используете плагин fancybox. Причина, по которой он «возвращается домой», заключается в том, что вы привязали обработчик кликов к ссылке, когда вы предполагаете инициализировать fancybox при загрузке страницы. Вернитесь к моему примеру здесь: jsfiddle.net/r83XF/2/show См. хэш URL не меняется при нажатии на кнопку. Также см. Я не привязывал никаких пользовательских обработчиков кликов. - person badsyntax; 21.03.2013
comment
badsyntax, когда я удалил .html(), с привязкой все в порядке! Большое спасибо, ИМО, приведенный выше ответ следует принять. - person Ajeesh Joshy; 11.07.2014