Ajax.BeginForm OnBegin不开火. NET MVC5应用程序)

我一直在尝试在没有成功触发页面的AJAX处理时触发Javascript函数。我的大部分时间都花在试图让OnBegin AjaxOption值工作上，但我也花了时间使用全局JQuery . ajaxsend处理程序(我认为它可能与ASP不兼容)。. NET MVC)，都没有成功。

我已经把我的页面简化成相当简单的东西。我的指数。项目的CSHTML为:

@using SalePointWebItemInquiry.Controllers
@using System.Web.Mvc.Ajax
@{
    ViewBag.Title = "Home Page";
}
@Scripts.Render("~/bundles/jquery", "~/bundles/jqueryval")
<script type="text/javascript">
    function TestFunction() {
        alert("Calling testfunction.");
    }
</script>
@using (Ajax.BeginForm("PressButton", 
    "Home", 
    new AjaxOptions
        {
            OnBegin = "TestFunction"
        })) 
{
<div>
        <input class="btn btn-default" type="submit" id="1" name="buttonType" value="Enter" />
</div>
}

显示的页面是:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Home Page - My ASP.NET Application</title>
    <link href="/Content/bootstrap.css" rel="stylesheet" />
    <link href="/Content/site.css" rel="stylesheet" />
    <script src="/Scripts/modernizr-2.6.2.js"></script>
  </head>
  <body>
    <div class="container body-content bordered">
      <script src="/Scripts/jquery-1.10.2.js"></script>
      <script src="/Scripts/jquery.validate.js"></script>
      <script src="/Scripts/jquery.validate.unobtrusive.js"></script>
      <script type="text/javascript">
        function TestFunction() {
          alert("Calling testfunction.");
        }
      </script>
      <form action="/Home/PressButton" data-ajax="true" data-ajax-begin="TestFunction" id="form0" method="post">
        <div>
          <input class="btn btn-default" type="submit" id="1" name="buttonType" value="Enter" />
        </div>
      </form>
      <footer>
        <div class="row">
          <div class="col-md-5">
            <p>&copy; 2015 - Application</p>
          </div>
          <div class="col-md-7 text-right">
            Version: Put version here
          </div>
        </div>
      </footer>
    </div>
    <script src="/Scripts/jquery-1.10.2.js"></script>
    <script src="/Scripts/bootstrap.js"></script>
    <script src="/Scripts/respond.js"></script>
    <!-- Visual Studio Browser Link -->
    <script type="application/json" id="__browserLink_initializationData">
      {"appName":"Internet Explorer","requestId":"d2eef5342ac64f3db1545856102f4a6f"}
    </script>
    <script type="text/javascript" src="http://localhost:53954/45ae7332668647b5a3795d87cd6ba1a9/browserLink" async="async"></script>
    <!-- End Browser Link -->
  </body>
</html>

有没有人对为什么TestFunction() Javascript函数在我点击ENTER按钮时不触发有任何想法?

解决方案:谢谢你的帮助:)。我没有正确引用jquery. unobtrusisive -ajax.js。我的问题的直接解决方案是使用Nuget在Nuget控制台使用以下命令检索不是本地的Javascript包:安装包Microsoft.jQuery.Unobtrusive.Ajax

因为我没有jquery. unob唐突-ajax.js本地，我所有的尝试引用它本地失败。我可能尝试过一两次CDN参考，但从来没有成功过，当时我有很多关于问题原因的理论。

我甚至不需要修改代码。当我检索到文件时，BundleConfig.cs中的代码会自动包含该文件:

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

您已经复制了

<script src="/Scripts/jquery-1.10.2.js"></script>

删除第二个，然后你还需要添加jquery.unobtrusive-ajax.js以便Ajax.BeginForm()工作(否则你只是做一个正常的提交-因此TestFunction()将永远不会被调用)

看起来你正在加载你的脚本之前，JQuery可以加载。脚本需要在页面底部body标签之前和JQuery加载之后加载。

请

@section Scripts
{
<script type="text/javascript">
    function TestFunction() {
        alert("Calling testfunction.");
    }
</script>
}

相关内容

最新更新

热门标签：