Question

我有一个包含ajax表单的Kendo UI窗口。我面临的问题是，在POST成功后，我关闭了窗口，我重新打开窗口重新使用它，但是下次我提交表单时它会POST两次，依此类推。如果我第三次提交，它将POST三次等。

我已经尝试过使用destroy（）函数，从DOM中完全删除窗口，然后通过jQuery重建它，但效果相同。在加载标记代码之前，我还尝试清空窗口的内容。

我一直在阅读来自Telerik的documentation，他们建议将UpdateTargetId放在表单之外，我也尝试过同样的效果。我知道有些东西缺失了，我无法确定它。

如何继续使用带有窗体的Kendo Window作为可重复使用的窗口（不使用与我使用窗口相同的号码）？

我在窗口内的ajax表单：

//abbreviated
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"></script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")"></script>
//abbreviated
<div id="paymentFormId">
    @using (Ajax.BeginForm("action", "controller", new { id = id }, new AjaxOptions
        {
            HttpMethod = "POST",
            UpdateTargetId = "paymentFormId",
            InsertionMode = InsertionMode.Replace,
            LoadingElementId = "loader"
        }, new { id = "payment-form" }))
    {
        @Html.Partial("PaymentForm", new PaymentForm())
    }
</div>
//abbreviated

我的PaymentForm标记：

//abbreviated
//bunch of text fields to submit
//abbreviated
<button type="submit" class="k-button">Submit</button>
<button onclick="closeWindow()" class="k-button">Close</button>

我的窗口声明：

@(Html.Kendo().Window()
    .Name("Window")
    .Title("My Win")
    .Content("Loading info...")
    .Modal(true)
    .Draggable()
    .Visible(false)
    .HtmlAttributes(new { style = "padding: 10px 15px; max-width: 400px;" })
    .AutoFocus(true)
    .Position(p => p.Top(100).Left(400))
    .Events(e => e.Close("onWindowClose"))
)

一些脚本：

//This script is the one that triggers the window to open
function openWindow(id) {
    var window = $("#Window").data("kendoWindow");
    window.refresh({
        url: "/controller/action",
        data: {
            id: id
        },
        error: function (xhr, textStatus, exceptionThrown) {
            window.close();
            alert($.parseJSON(xhr.responseText));
        }
    });
    window.open();
}

//This is the registered close event
function onWindowClose(e) {
    var id = $("#ID").val();
    if (id != null) {
        $.ajax("/controller/action", {
            type: "POST",
            dataType: "json",
            data: {
                id: id
            },
            success: function (data) {
                //TODO: derp
            },
            error: function (xhr, textStatus, exceptionThrown) {
                alert($.parseJSON(xhr.responseText));
            }
        });
    }
    //var myWin = new $("#Window").data("kendoWindow");
    //myWin.destroy();
    $(this.element).empty();
    $(this.element).html("Loading content...");
}

Answer 1

我有一个我重复使用的包含表单元素的kendo窗口，而该表单元素又包含一些文本输入框和一个文件输入框。为了防止该表单重新提交文件输入，我在关闭kendo窗口时重置表单。我不得不从主线程中做到这一点，以防止通过调用类似

之类的事件来进行POST操作

closeAddAttachmentWindow: function () {
        var window = $("#addAttachmentWindow").data("kendoWindow");
        window.close();

        setTimeout(function () {
            $("#formUpload").trigger('reset');
        }, 200);
    },

你在OnWindowClose（e）函数中尝试过类似的东西吗？

我想重用包含ajax表单的Kendo Window

1 个答案: