Question

<div data-bind="style: { display: !koIsHidden() ? 'inline-block' : 'none'}">
<button id="hideButton" type="button" title="Hide" onclick="javascript:openJuiPopup('#hidePopup')" style="background: none; border: none">
    <i id="hideCross" class="fa fa-2x fa-times" data-bind="attr: { 'data-applicationKey': application.applicationKey }"></i>
</button>
</div>

此按钮会加载一个类似于此内容的弹出窗口

弹出窗口的代码如下：

<div id="hidePopup" class="popup ui-content" data-role="popup">
    <!-- ko foreach: { data: previewApplications(), afterRender: renderPopup} -->
    <form id="hider" style="display:inline;" method="post" data-bind="attr: {action: '@(MVC.GetLocalUrl(MVC.HireOrgJobApplication.ViewApplication(Model.CurrentOrganization.CustomUrl, Model.Job.JobKey, "xxx/ajax-hide")))'.replace('xxx', application.applicationKey)}">
        @Html.AntiForgeryToken()
        <input type="hidden" name="ApplicationKey" data-bind="attr:{ value : application.applicationKey }" />
        <input type="hidden" name="HideReasonId" value="7" />


        <button type="submit" class="btn btn-danger jui-tooltip" data-bind="text: application.hideButtonSendRejectionInsteadOfHide === true ? 'Reject' : 'Hide', attr: { title: application.hideButtonSendRejectionInsteadOfHide === false ? 'Reject' : 'Hide'}"></button>

    </form>
    <!--/ko-->
</div>

调用它的js代码：

            $("#hidePopup").dialog({
                dialogClass: "no-close",
                position: { my: "bottom", at: "bottom", of: $("#hideCross"), collision: "none" },
                autoOpen: false,
                draggable: true,
            }).dialog("widget").find(".ui-dialog-titlebar").hide();

细节并不重要，但在此代码中有一件重要的事情是

    <!-- ko foreach: { data: previewApplications(), afterRender: renderPopup} -->

由于knockout js的afterRender功能，这应该遍历previewApplications（）中的元素并运行renderPopup函数。

renderPopup看起来像

                self.renderPopup = function (element, data) {

                    $(element).find("form#hider").ajaxForm(function () {
                        alert("heyyyyy");
                    });

                };

这应该只是找到一个id = hider的表单，并运行alert（＆＃34; heyyyy＆＃34;）。但它没有用。

请注意，当我把它放在弹出窗口之外时，AfterRender工作得很好。

请帮忙！

编辑：

我可以为此问题添加更多信息。它不是关于afterRender，但是ajaxForm对弹出窗口不起作用。有什么想法吗？

EDIT2：

                self.renderApplication = function (element, data) {

                    filter: ($(element).filter("form#hider")[0]).ajaxForm(function () {
                        data.koIsHidden(true);
                    });

                };

我试过这个和

                    $(element).filter(("form#hider")[0]).ajaxForm(function () {
                        data.koIsHidden(true);
                    });

上面的代码给了我在评论中写的错误，第二个给了我没有错误，但仍然没有捕获renderApplication函数。

Answer 1

像函数一样调用renderPopup - afterRender：renderPopup（）或者你可能需要尝试$ root.renderPopup（）或$ parent.renderPopup（）。

knockout.js afterRender无法在jquery弹出窗口中工作

1 个答案: