Question

我有几乎正常工作的代码，但我无法在弹出窗口中进行自动完成工作。如果我做下一件事：当项目运行时，打开弹出窗口并输入FireBug控制台：

 $(":input[data-autocomplete]").each(function() {
                        $(this).autocomplete({ source: $(this).attr("data-skillsautocomplete") });
                    });

然后一切都很完美。所以，问题是我不知道如何将我的jquery函数传递给弹出窗口。请帮帮我。

JS

ko.bindingHandlers.jqDialog = {
    init: function(element, valueAccessor) {
        var options = ko.utils.unwrapObservable(valueAccessor()) || {};
        ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
            $(element).dialog("destroy");
        });
        setTimeout(function() {
            $(element).dialog(options);
        }, 0);
    }
};
ko.bindingHandlers.openDialog = {
    update: function(element, valueAccessor) {
        var value = ko.utils.unwrapObservable(valueAccessor());
        if (value) {
            $(element).dialog("open");
        } else {
            $(element).dialog("close");
        }
    }
};
ko.bindingHandlers.jqButton = {
    init: function(element, valueAccessor) {
    var options = ko.utils.unwrapObservable(valueAccessor()) || {};
    //handle disposal
    ko.utils.domNodeDisposal.addDisposeCallback(element, function() {
        $(element).button("destroy");
    });
    $(element).button(options);
    }
};

     $(":input[data-autocomplete]").each(function() {
                        $(this).autocomplete({ source: $(this).attr("data-skillsAutocomplete") });
                    });

     function pageModel() {

        self.selectedVacancyForEdit = ko.observable();
        self.skillToAdd = ko.observable();

        self.editVacancy = function(){
            self.selectedVacancyForEdit(new Vacancy());
            //here pop-up window opens
        }  
        self.addSkill = function(){
            //adding skill
        }  
    }

UI
     ....code....
    //Pop-up window
    <div id="details" data-bind="jqDialog: { autoOpen: false, resizable: true, modal: true, width:'auto'}, template: { name: 'editTmpl', data: selectedVacancyForEdit, if: selectedVacancyForEdit }, openDialog: selectedVacancyForEdit"></div>
        <script id="editTmpl" type="text/html">   
            <fieldset>
                 <form data-bind="submit: $root.addSkill">
                     Add skill: <input type="text" data-bind="value: $root.skillToAdd, 
                                 valueUpdate: 'blur'"
                                 data-skillsAutocomplete="@Url.Action("SearchSkill", "Home")"
                                 name="search"/>`
            </fieldset>
    </script>
</div>

Answer 1

尝试改变

$(":input[data-autocomplete]")

到

$("input[data-autocomplete]")

Knockout，Jquery Dialog并没有自动完成工作

1 个答案: