首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

在asp.net mvc中提交Ajax.BeginForm后,jQuery代码无法正常工作

在ASP.NET MVC中,当使用Ajax.BeginForm提交表单后,可能会遇到jQuery代码无法正常工作的问题。这通常是由于以下几个原因导致的:

  1. 引用错误:首先要确保在页面中正确引用了jQuery库。可以通过在页面的头部添加以下代码来引用jQuery:
代码语言:txt
复制
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>

或者可以使用腾讯云提供的CDN链接:

代码语言:txt
复制
<script src="https://cdn.staticfile.org/jquery/3.6.0/jquery.min.js"></script>

这样可以确保jQuery库被正确加载。

  1. Ajax选项设置错误:在使用Ajax.BeginForm时,需要正确设置Ajax选项。可以通过在表单中添加以下代码来设置Ajax选项:
代码语言:txt
复制
@using (Ajax.BeginForm("ActionName", "ControllerName", new AjaxOptions { HttpMethod = "POST", OnSuccess = "successFunction" }))
{
    // 表单内容
}

其中,ActionName和ControllerName分别是表单提交后要执行的Action和Controller的名称。OnSuccess是一个回调函数,用于处理Ajax请求成功后的操作。

  1. jQuery代码位置错误:如果jQuery代码位于页面底部,可能会导致在Ajax请求返回之前就执行了,从而无法正常工作。为了解决这个问题,可以将jQuery代码放在一个函数中,并在OnSuccess回调函数中调用该函数。例如:
代码语言:txt
复制
function myFunction() {
    // jQuery代码
}

function successFunction() {
    myFunction();
}

以上是解决在ASP.NET MVC中使用Ajax.BeginForm后jQuery代码无法正常工作的一些常见方法。如果仍然无法解决问题,可以进一步检查浏览器的开发者工具中是否有错误提示,并根据错误提示进行调试和修复。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

Ajax.BeginForm()知多少

ASP.NET MVCAjax.BeginForm扮演着异步提交的重要角色。其中就有五个重载方法,但是实际应用,你未必使用的得心应手,今天我们就从主要的参数来一探究竟。...也支持两种赋值方式: object类型可以使用时直接以匿名类方式声明,使用非常方便 举例:new{id = "frm", @class = "cls" }由于class是C#的关键字,因此需要在前面加...@符号 IDictionary类型使用灵活,可以一个地方声明,多个地方调用,或修改使用,举例: Dictionary htmlAttr = new Dictionary...Confirm,就是提交时会弹出一个确认框,一般不常用。 new AjaxOption(){Confirm:"确认提交?"} HttpMethod,就是设置请求类型,默认为post。...经过参考jquery.unobtrusive-ajax.js 源码,终于弄清,默认的传参是怎样的。

2.3K60

ASP.Net MVC开发基础学习笔记:四、校验、AJAX与过滤器

二、ASP.Net MVC下的两种AJAX方式 2.1 使用JQuery AJAX方式   首先,ASP.Net MVC中使用此种方式跟普通的WebForm的开发方式是一致的,需要注意的是:Url地址不同...至此,一个使用JQuery Ajax的MVC页面就完成了。但是,这仅是一个最简单的AJAX示例,实际开发往往比较复杂一点。   ...Action打的标签一致; 2.2 使用Microsoft AJAX方式   ASP.Net MVC除了可以使用JQuery AJAX外,Microsoft为我们提供了另一套实用且更简单的AJAX方案...这里是POST方式;   Confirm代表点击提交按钮提出的确认对话框,并给出用户给定的提示语,这里是:您确定要提交?   ...三、为AOP而生 — ASP.Net MVC默认的过滤器 3.1 过滤器初步   大一点的项目总会有相关的AOP面向切面的组件,而MVC(特指:Asp.Net MVC,以下皆同)项目中Action执行前或者执行我们想做一些特殊的操作

2.1K20

ABP入门系列(5)——展现层实现增删改查

最终实现效果如下图: 一、定义Controller ABP对ASP.NET MVC Controllers进行了集成,通过引入Abp.Web.Mvc命名空间,创建Controller继承自AbpController...1,引入js文件 使用异步提交需要引入jquery.validate.unobtrusive.min.js和jquery.unobtrusive-ajax.min.js,其中jquery.unobtrusive-ajax.min.js...为了使用ASP.NET MVC强视图带给我们的好处(模型绑定、输入校验等等),我们需要创建一个ViewModel来进行模型绑定。...而我们代码另一种方式是通过@Html.Action("Create")的方式,加载Index的视图的作为子视图同步加载了进来。 感兴趣的同学自行查看源码,不再讲解。...展现层主要用到了Asp.net mvc的强类型视图、Bootstrap-Modal、Ajax异步提交技术。 其中需要注意的是,异步加载表单时,需要添加以下js代码jquery方能进行前端验证。

3.9K50

了解ASP.NET MVC几种ActionResult的本质:EmptyResult & ContentResult

本篇文章着重介绍进行Ajax调用中经常使用的两个ActionResult,即JavaScriptResult和JsonResult。[本文已经同步到《How ASP.NET MVC Works?》...我们演示一个在线购物的场景:用于完成了商品选购之后提交订单,服务端处理订单的时候需要确认订购的商品是否超出了对应的库存量,如果存量充裕则正常处理该订单,否则提示库存不足,并将商品实时库存量显示给用户让他修正相应商品的购买量...通过Visual Studio的ASP.NET MVC项目模板创建的空Web应用定义一个ShoppingCart类表示购物车。...一个以Ajax请求提交的表单(表单的Action属性对应着上面定义的Action方法ProcessOrder)显示了购物车的商品和数量,用于可以修改订购数量并通过点击“提交订单”按钮以Ajax请求的方式提交订单...MVC几种ActionResult的本质:EmptyResult & ContentResult 了解ASP.NET MVC几种ActionResult的本质:FileResult 了解ASP.NET

1.7K50

了解ASP.NET MVC几种ActionResult的本质:JavaScriptResult & JsonResult

本篇文章着重介绍进行Ajax调用中经常使用的两个ActionResult,即JavaScriptResult和JsonResult。[本文已经同步到《How ASP.NET MVC Works?》...我们演示一个在线购物的场景:用于完成了商品选购之后提交订单,服务端处理订单的时候需要确认订购的商品是否超出了对应的库存量,如果存量充裕则正常处理该订单,否则提示库存不足,并将商品实时库存量显示给用户让他修正相应商品的购买量...通过Visual Studio的ASP.NET MVC项目模板创建的空Web应用定义一个ShoppingCart类表示购物车。...一个以Ajax请求提交的表单(表单的Action属性对应着上面定义的Action方法ProcessOrder)显示了购物车的商品和数量,用于可以修改订购数量并通过点击“提交订单”按钮以Ajax请求的方式提交订单...MVC几种ActionResult的本质:EmptyResult & ContentResult 了解ASP.NET MVC几种ActionResult的本质:FileResult 了解ASP.NET

1.7K80

利用动态注入HTML的方式来设计复杂页面

对于这种复杂的页面,我们设计的时候不可以真的将所有涉及的元素通通至于某个单独的View,将复杂页面相对独立的内容“分而治之”才是设计之道。...我们可以借鉴Smart Clent应用的设计方式:将一个Windows Form作为应用的容器(Smart Client Shell),操作过程动态地激活相应的用户控件(Smart Part)并加载到容器...这个“单页面应用”是通过ASP.NET MVC开发的,接下来我们来逐步介绍如果将同一页面的这三块不同的内容提取出来进行“分而治之”。..." }))),它以如下的方式定义Index.cshtml。...至于中间的两行代码,在于解决动态添加表单无法实施验证的问题。

3.5K20

ASP.NET MVC 异步实现

MVC 实现异步操作有两种方法,一种是使用jQuery的异步函数,另一种就是使用MVC的 AjaxHelper 注意:在行为详解中提到过,如果行为的返回对象为JsonResult 时,要使用get...获取必须添加第二个参数-JsonRequestBehavior.AllowGet. jQuery方法实现 注意:jQuery实现需要调用jquery文件 先编写控制器方法: public ActionResult...发送post请求给AjaxTest/ CalcAdd这个action,自动识别传送的name:a,b,并通过路由实现自动接收装配,经由控制器的action的操作,将结果异步返回给网页。...function Success(obj) { $('#result').val(obj.Sum); } 使用 AjaxHelper 创建一个Ajax表单: @using (Ajax.BeginForm...name = "b" /> } 表单提交后会使用前面创建的回掉函数并给值

1.2K30

MVC项目开发那些用到的知识点(Jquery ajax提交Json后台处理)

前言   jQuery提供的ajax方法能很方便的实现客户端与服务器的异步交互,asp.net mvc 框架使用jQuery能很方便地异步获取提交数据,给用户提供更好的体验!   ...调用jQuery的ajax方法时,jQuery会根据post或者get协议对参数data进行序列化;   如果提交的数据使用复杂的json数据,例如:     {userId:32323,userName...:{firstName:"李",lastName:"李大嘴"}}   那么服务器是无法正常接收到完整的参数,因为jQuery对data的序列化,是使用了键值对拼装的方式; 参数拼装成 userId=32323&...userName=object ; userName所指向的对象被序列化成字符串"object"   如何才能把一个复杂的object对象提交到后台的action参数呢?...MVC 的更多信息,请访问 http://asp.net/mvc

1.7K31

MVC项目开发那些用到的知识点(Jquery ajax提交Json后台处理)

前言   jQuery提供的ajax方法能很方便的实现客户端与服务器的异步交互,asp.net mvc 框架使用jQuery能很方便地异步获取提交数据,给用户提供更好的体验!   ...调用jQuery的ajax方法时,jQuery会根据post或者get协议对参数data进行序列化;   如果提交的数据使用复杂的json数据,例如:     {userId:32323,userName...:{firstName:"李",lastName:"李大嘴"}}   那么服务器是无法正常接收到完整的参数,因为jQuery对data的序列化,是使用了键值对拼装的方式; 参数拼装成 userId=32323&...userName=object ; userName所指向的对象被序列化成字符串"object"   如何才能把一个复杂的object对象提交到后台的action参数呢?...MVC 的更多信息,请访问 http://asp.net/mvc

1.9K20

ASP.NET MVC集成EntLib实现“自动化”异常处理

[源代码从这里下载][本文已经同步到《How ASP.NET MVC Works?》...以用户登录场景为例,我们通过Visual Studio的ASP.NET MVC项目模板创建的Web应用定义了如下一个简单的数据类型LoginInfo封装用户登录需要输入的用户名和密码。...该View,作为Model的LoginInfo对象以编辑默认呈现在一个表单,表单中提供了一个“登录”提交表单。除此之外,View还具有个ValidationSummary。...运行该程序一个用于登录页面会呈现出来,当我们输入错误的用户名和密码的时候,相应的错误消息(配置通过ErrorMessageHandler设置的错误消息)会以如图7-16所示的效果显示出来,其实整个...ASP.NET MVC集成EntLib实现“自动化”异常处理[实例篇] ASP.NET MVC集成EntLib实现“自动化”异常处理[实现篇]

1.1K100

ASP.NET MVC 4, ASP.NET Web API 和ASP.NET Web Pages v2(Razor)现在都是开源了

你可以CodePlex 上查找源。请务必阅读ScottGu 的博客的详细信息。 耶, 我加粗、 加下划线和斜体的最后部分,是的,这是无偿的。;) 这是我们组织的许多人艰辛工作的结果。...这也正是我来微软工作的原因。所以,这里发生了什么? 自从成立以来, ASP.NET MVC 已经是开源的了,2009 年 4 月转换为了 MS PL 许可证,开发人员没有从社区采用贡献程序。...我们开放源代码时,我们没有“开放源码,索取回报”。 今天我们继续前进,现在 ASP.NET MVC,Web API, Web Pages将会从社区采纳贡献的程序。...我们 Visual Studio 2010的NuGet推出社区代码, NuGet 已采纳了社区贡献。现在我们将在即将发布的Visual Studio版本ASP.NET内部推出社区代码。...ASP.NET MVC 可以Mono 上运行, 我们很喜欢这一点,我们期待着从Mono社区获取代码贡献。事实上,上周我打电话给我的朋友Miguel,所以他是第一个提交请求的人。

1.6K60

七天学会ASP.NET MVC (四)——用户授权认证问题

小编应各位的要求,快马加鞭,马不停蹄的终于:七天学会 Asp.Net MVC 第四篇出炉,第四天的学习,我们主要了学习如何在MVC如何实现认证授权等问题,本节主要讲了验证错误时的错误值,客户端验证...系列文章 七天学会ASP.NET MVC (一)——深入理解ASP.NET MVC 七天学会ASP.NET MVC (二)——ASP.NET MVC 数据传递 七天学会ASP.NET MVC (三)——...本系列的第一讲,我们了解了Asp.NetMVC的意义,知道MVCAsp.net的一部分,MVC继承了ASP.NET的所有特征,包含表单认证。 先来了解ASP.NET是如何进行Form认证的。...让我们了解一些小的工作细节。 客户端通过浏览器给服务器发送请求。 当通过浏览器生成,所有相关的Cookies也会随着请求一起发送。 服务器接收请求,准备响应。...View 添加 jQuery Validation 引用 Scripts文件,添加以下 JavaScript文件 jQuery-Someversion.js jQuery.valiadte.js

8.7K50

asp.net core 系列】 1 带你了解一下asp.net core

ASP是一种HTML+服务器代码的组合,其后缀是.asp 。 2001年,微软宣布将asp迁移到.NET Framework上,形成了一种新的脚本语言——名为asp.net。...结合了.net之后的asp.net 更加强大。 2008年之前的某一年,asp.net mvc 上线了。...它的通信流程是这样的: 用户访问界面(View),提交请求(包括访问请求) 界面向控制器(Controller)转送用户的请求,并进行一定程度封装 控制器(Controller)处理并完成,以Model...不过,最主要的一点就是,MVC可以让你离那些大佬更近一步(意思就是能让你获得一个工作)。 2. ASP.NET Core 入门 在上一节,我胡扯了一堆,说不定打消了很多人的兴趣,哈哈,开个玩笑。...然后浏览器输入: http://localhost:5000 然后就能看到如下内容: ?

1.1K30

ASP.NET Core 2.0 : 三. 项目结构

SDK同样是一个大而全的集和, 部署的时候, SDK的引用依然不会出现在部署包, 如下图, 是不是很精简 ?...当输入的格式不正确的时候, 给出提示, 最早我们经常是输入或者提交前用js将输入的内容正则验证一下,  这个不用那么麻烦了, 我们通过如下代码引用_ValidationScriptsPartial.cshtml...有一个比较特别的地方就是比原版MVC多了个@addTagHelper 在上文的validation我们看到过这样的代码 ..., imageContext); imageElement.attr('alt', imageElement.attr('id').replace(/ID/, '')); }       缩减代码...在这里, 我们可以向管道通过中间件的方式插入我们需要的工作内容. 比如我们还可以用app.UseAuthentication()来做身份验证.

1.8K50

七天学会ASP.NET MVC(七)——创建单页应用

系列文章 七天学会ASP.NET MVC (一)——深入理解ASP.NET MVC 七天学会ASP.NET MVC (二)——ASP.NET MVC 数据传递 七天学会ASP.NET MVC (三)——...ASP.Net MVC 数据处理 七天学会ASP.NET MVC (四)——用户授权认证问题 七天学会ASP.NET MVC (五)——Layout页面使用和用户角色管理 七天学会ASP.NET MVC...然而,Asp.net MVC 项目中使用自定义文件夹实现功能模块化会导致很多问题。...如之前所说的,Controller存放的路径是不受限制的,因此它可以工作但可能不会正常的显示,因为无法找到合适的View。...服务器端与客户端进行数据通信 之前的实验,使用Form标签和提交按钮来辅助完成的,现在由于使用这两种功能会导致全局刷新,因此我们将使用jQuery Ajax方法来替代Form标签和提交按钮。

4.2K60

Asp.Net MVC4入门指南(8):给数据模型添加校验器

ASP.NET MVC鼓励您指定功能或者行为,只做一次,然后将它应用到应用程序的各个地方。这可以减少您需要编写的代码量,并减少代码出错率,易于代码维护。...文件 (地址https://github.com/jquery/globalize) JavaScript 可以使用 Globalize.parseFloat。...您可能已经注意到了Title 和Genre属性,字段输入文本或者删除文本,是不会执行所需的验证属性的,直到您提交表单 (点Create按钮)时才执行。...如果您在浏览器禁用 JavaScript,然后提交具有错误信息的form,断点将会命中。您仍然得到充分的验证,即使没有 JavaScript的情况下。...,全文最终完成了一个管理影片的小系统,非常适合新手入门Asp.Net MVC4,并由此开始开发工作

4.6K100

如何ASP.NET Core Razor处理Ajax请求

这些类似于ASP.NET MVC或WEB API的Action方法。Razor Pages遵循特定的命名约定,Handler方法也是如此。...用户点击"登录按钮"利用Jquery获取文本框的值,异步提交到服务器。很简单的功能,相信大家都写过很多次了。啪啪啪几下代码就撸出来了。 首先解释下/user/Login?...你不必编写任何其他代码。Razor页面自动包含防伪令牌生成和验证。这里请求失败,是因为POST没有提交AntiForgeryToken。 有两种方法可以添加AntiForgeryToken。...ASP.NET Core MVC 2.0,FormTagHelper为HTML表单元素注入反伪造令牌。...所以,修改的Ajax请求看起来像这个样子: 改良代码发送请求前在请求头中增加了"XSRF-TOKEN"标识,值为表单自动生成的防伪标记。

1.8K90

ASP.NET MVC5的Model验证

Model验证是ASP.NET MVC的重要部分,它主要用于判断输入的数据类型及值是否符合我们设定的规则,这篇文章就介绍下ASP.NET MVCModel验证的几种方式。...除此之外,ASP.NET MVC还会帮助我们进行数据类型的验证,如,若在年龄一栏输入非整数,那么验证将不会通过,且会提示数值不合法。...除了我们自己手写js代码外,ASP.NET MVC也提供了前端验证方法,要启用ASP.NET MVC提供的前端验证方法需要在页面引入三个js文件: jquery-1.10.2.min.js(也可以是其它版本的...jQueryjquery.validate.min.js jquery.validate.unobtrusive.min.js 然后配置文件开启客户端验证(默认是开启的): <configuration...引用文件之后,运行程序,然后查看页面源代码,可以看到form的input标签多出了 data-val 属性以及其它的和数据注解相关的属性。 对于验证失败的信息,我们需要对用户进行相应的提醒。

1.5K20
领券