Home/ Questions/Q 9244435
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-18T09:01:46+00:00

I have just started a new project in MVC4 using some code from an

  • 0

I have just started a new project in MVC4 using some code from an existing MVC3 project. I can force my form to ajax reload the specific DIV, but not using the normal submit method, only with the test doSomthing() javascript function. What am I missing?

To clarify: The first button does not work right, the second one does – but I don’t want to do it that way.

VIEW

@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>

I know this should work.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I had the same problem. The solution is to add a statement in _Layout.cshtml page.

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

    The definition of ScriptBundle(“~/bundles/jqueryval”) as below

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