MVC4 Kendo项目Ajax.BeginForm UpdateTargetId问题

时间:2013-02-05 17:08:12

标签: asp.net-mvc-4 kendo-ui

我刚刚使用现有MVC3项目中的一些代码在MVC4中启动了一个新项目。我可以强制我的表单重新加载特定的DIV,但不使用正常的提交方法,只有测试doSomthing()javascript函数。我错过了什么?

澄清:第一个按钮不能正常工作,第二个按钮工作正常 - 但我不想这样做。

查看

@using (Ajax.BeginForm("Method1", null,
new AjaxOptions { HttpMethod = "post", UpdateTargetId = "divPartial1" },
new { id = "form1" }))
{
    <div class="data">
        @Html.LabelFor(x => x.TotalSubmitted, new { @class = "total" })<div class="number total">@Html.FormatValue(Model.TotalSubmitted, "{0:n0}")</div>
        ...
    </div>
    <div class="details">
        <div id="divPartial1">
            @Html.Partial("ReportDashboardAppPartial")
        </div>
    </div>
    <div style="text-align: center;">
        <button type="submit" class="k-button"><span class="k-icon k-i-search" /></button>
        <button type="button" name="Save" value="Save" onclick="doSomething(); return false;"><span class="k-icon k-i-search" /></button>
    </div>
}
<script type="text/javascript">
    function doSomething() {
        $.ajax({
            url: '@Url.Action("Method1", "Controller")',
        type: 'post',
        data: $('form#form1').serialize(),
        success: function (result) {
            $('#divPartial1').html(result);
        }
    });
}
</script>

_layout

@model BaseViewModel
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title</title>
    <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery")
    <link href="@Url.Content("~/Content/kendo.compatibility.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/kendo/2012.3.1114/kendo.common.min.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/kendo/2012.3.1114/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/kendo/2012.3.1114/kendo.default.min.css")" rel="stylesheet" type="text/css" />
    @RenderSection("styles", false)
    <script src="@Url.Content("~/Scripts/kendo/2012.3.1114/jquery.min.js")"></script>
    <script src="@Url.Content("~/Scripts/kendo/2012.3.1114/kendo.all.min.js")"></script>
    <script src="@Url.Content("~/Scripts/kendo/2012.3.1114/kendo.aspnetmvc.min.js")"></script>
    @RenderSection("scripts", false)
</head>
<body>
    @Html.Partial("_AlertWindow")
    <div id="wrapper">
        <header>
            <div id="logindisplay">
                @Html.Partial("_LoginPartial")
            </div>
            <a href="@Url.Action("Index", "Home")">
                <div id="logo"></div>
            </a>
            <div id="title">
                <h1>Ha!</h1>
            </div>
            @(Html.Kendo().Menu().Name("Menu").BindTo("Main").SecurityTrimming(true))
        </header>
        <div id="main">
            @RenderBody()
        </div>
        <footer>
            <div id="version">@Html.ActionLink("Version " + @Model.CurrentVersion, "About", "Home")</div>
        </footer>
    </div>
    @RenderSection("end_scripts", false)
</body>
</html>

我知道这应该有用。

1 个答案:

答案 0 :(得分:7)

我遇到了同样的问题。解决方案是在_Layout.cshtml页面中添加一个语句。

@ Scripts.Render(“〜/ bundles / jqueryval”)

ScriptBundle(“〜/ bundles / jqueryval”)的定义如下

bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
            "~/Scripts/jquery.unobtrusive*",
            "~/Scripts/jquery.validate*"));