剑道功能在 event.stopImmediatePropagation 后停止工作

Question

我想使用 Ajax.BeginForm 向我的控制器发送一个 HttpPostedFileBase。

因为我使用的是 Ajax，所以我需要调整我的请求以使其正常工作，（否则文件为空）。

我面临的问题是，在我的表单中，kendo 功能（多选、文件输入）在使用 ajax 重新加载内容后不会重新加载/停止工作。导致此问题的脚本正在使用

e.stopImmediatePropagation();

由于某种原因停止了所有剑道功能，（这里没有 javascript 专家）。

多选视图：

@(Html.Kendo().MultiSelectFor(x => x.ProductModel.AddProductSubCategories)
                              .Name("ProductModel.AddProductSubCategories")
                      .HtmlAttributes(new { @class = "multi-select" })
                                                      .DataTextField("SubCategoryName")
                                                      .DataValueField("SubCategoryID")
            )

脚本：

window.addEventListener("submit", function (e) {
        var form = e.target;
        alert($(form).attr('id'));
        if (form.getAttribute("enctype") === "multipart/form-data") {
            if (form.dataset.ajax && $(form).valid()) {
                e.preventDefault();
                e.stopImmediatePropagation();
                $('.admin-add-product-message-container').remove();
                AjaxLoadUp();
                var xhr = new XMLHttpRequest();
                xhr.open(form.method, form.action);
                xhr.onreadystatechange = function () {
                    if (xhr.readyState == 4 && xhr.status == 200) {
                        if (form.dataset.ajaxUpdate) {
                            var updateTarget = document.querySelector(form.dataset.ajaxUpdate);
                            if (updateTarget) {
                                updateTarget.innerHTML = xhr.responseText;
                            }
                        }
                    }
                };
                xhr.send(new FormData(form));
            }
        }
    }, true);

我尝试过使用重新加载剑道脚本

$.getScript("myscript");

在 if (updateTarget) 中，但这并不能解决我的问题。

有什么建议吗？ 谢谢

Answer 1

答案取自剑道官方论坛：

小部件将停止工作，因为当响应设置为 innerHTML 属性时不会评估脚本。您可以使用 jQuery html 方法来设置响应以避免问题，例如

if (updateTarget) {
   $(updateTarget).html(xhr.responseText);
}