【问题标题】:Knockout, Jquery Dialog and not working autocomplete淘汰赛,Jquery Dialog 和不工作的自动完成
【发布时间】:2013-11-07 00:03:20
【问题描述】:

我的代码几乎可以工作,但我无法在弹出窗口中进行自动完成工作。 如果我做下一件事:当项目运行时,打开弹出窗口并在 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>

【问题讨论】:

    标签: javascript jquery knockout.js


    【解决方案1】:

    尝试改变

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

    $("input[data-autocomplete]")
    

    【讨论】:

    • 可能焦点丢失了.. 将 .each(function() { $(this).autocomplete 改为 .each(function(index, el) { $(el).autocomplete
    猜你喜欢
    • 2013-07-14
    • 2013-11-25
    • 2013-02-04
    • 1970-01-01
    • 2013-03-19
    • 2019-06-20
    • 2012-10-18
    • 2016-11-25
    • 1970-01-01
    相关资源
    最近更新 更多