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

为什么Ajax Actionlink在返回bootstrap模式的部分视图时会提交两次?

Ajax ActionLink 是 ASP.NET MVC 中的一个辅助方法,用于在前端页面中生成一个可以通过 Ajax 请求后端处理程序的链接。当使用 Bootstrap 模式的部分视图时,有时会出现提交两次的情况。这个问题通常是由于事件绑定不正确或者事件冒泡导致的。

解决这个问题的方法有以下几种:

  1. 确保事件绑定正确:在使用 Ajax ActionLink 生成的链接时,确保事件绑定在正确的元素上。如果事件绑定在了父元素上,可能会导致事件冒泡,从而触发两次提交。
  2. 阻止事件冒泡:在事件处理程序中使用 event.stopPropagation() 方法来阻止事件冒泡。这样可以确保只有点击的元素触发事件,而不会触发父元素的事件。
  3. 使用 return false:在事件处理程序的最后使用 return false 来阻止默认的事件行为和事件冒泡。这样可以确保只有一次提交。
  4. 检查是否有其他冲突的事件:检查页面中是否有其他可能导致提交两次的事件,例如其他的点击事件或表单提交事件。确保这些事件与 Ajax ActionLink 的事件没有冲突。

总结起来,解决 Ajax ActionLink 在返回 Bootstrap 模式的部分视图时提交两次的问题,需要确保事件绑定正确,阻止事件冒泡,使用 return false 来阻止默认事件行为和事件冒泡,并检查是否有其他冲突的事件。

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

相关·内容

【ASP.NET Core 基础知识】--MVC框架--Views和Razor语法

部分视图 部分视图(Partial View)是ASP.NET Core中可重用、可以被其他视图部分视图包含组件。...以下是如何创建和使用部分视图基本步骤: 创建部分视图 Views文件夹中创建一个名为Shared文件夹: /Views /Shared Shared文件夹中创建部分视图文件,例如...-- 视图中传递模型给部分视图 --> @Html.Partial("_MyPartialView", model: new MyModel()) 使用 @model 声明部分视图模型 部分视图文件顶部使用...部分视图中使用表单,可以视图中通过 Html.RenderPartial 或 Html.Partial 来包含部分视图,然后部分视图中定义表单。...5.3 表单验证和处理 ASP.NET Core中,表单验证和处理是Web应用程序中关键部分。ASP.NET Core提供了内置模型验证和处理机制,可以方便地处理用户提交表单数据。

43220
  • ASP.NET MVC框架(第四部分): 处理表单编辑和提交场景

    第三篇讨论了控制器是如何与视图做交互,特别地讨论了你可以把视图数据从控制器传给视图以显示返回到客户端回复各种方法。...点击Save(保存)之后,产品就会添加到数据库中,然后就会转向返回到产品列表网页。 编辑产品 在产品列表网页上,用户可以点击每个产品旁边“Edit”(编辑)链接。...我们是用在第二部分中讨论过Html.ActionLink辅助方法来显示这些HTML超链接(譬如,Edit)"Edit"链接被点击后,...实现添加新产品(第一部分-背景知识) 现在让我们来实现网站“添加新产品”表单提交功能,最终我们想要用户访问/Products/New URL时看到象下面这样显示: ?...我们将通过生成一个封装这些列表强类型ProductsNewViewData类,然后将它传给视图来达成这个目的(你可以第三部分中了解有关详情): ?

    5.1K70

    Asp.net mvc 知多少(三)

    主要有以下三个比较重要命名空间: System.Web.Mvc - 此命名空间包含类和接口是为了支持ASP.NET Web应用程序Mvc模式。...视图引擎是怎样工作? Ans. 每种视图引擎主要包括以下三个主要部分: ViewEngine class - 实现自IViewEngine接口;职责是定位视图模板位置。...通过global.asax.cs文件Application_Start()方法注册自定义视图引擎,来告诉ASP.NET MVC来使用自定义视图引擎替换默认视图引擎。...ASP.NET MVC提供了基于jquery非侵入ajax。非侵入式ajax意味着通过使用帮助类方法去定义ajax功能而不是通过view中添加js代码块。 Q38....介绍下AJAX帮助类配置选项? Ans. AjaxOptions类定义属性允许你ajax请求生命周期中不同阶段指定对应回调方法。

    2.3K60

    Asp.Net MVC4入门指南(6):验证编辑方法和编辑视图

    在上图中所生成链接是http://localhost:xxxxx/Movies/Edit/4默认路由 (App_Start\RouteConfig.cs 中设定) 使用 URL 匹配模式为: {...HttpGet Edit方法会获取电影ID参数、 查找影片使用Entity Framework Find方法,并返回到选定影片编辑视图。... GET 方法中修改数据还违反了 HTTP 最佳做法和Rest架构模式, GET 请求不应更改应用程序状态。...该方法将返回一个视图包含一个 HTML 表单。...(使用 Distinct修饰符,不会添加重复流派 -- 例如,我们示例中添加了两次喜剧)。该代码然后ViewBag对象中存储了流派数据列表。 下面的代码演示如何检查movieGenre参数。

    4.3K100

    ASP.NET MVC5高级编程——(4)表单和HTML辅助方法

    带有连字符C#属性名是无效,但所有的HTML辅助方法渲染HTML时会将属性名中下划线转换为连字符。...return View(); 5 } 相应视图中,使用ViewBag中值来为TextBox辅助方法命名,可以实现渲染显示价格文本框: @Html.TextBox("Price") TextBox...") 13 URL辅助方法 URL辅助方法与HTMLActionLink和RouteLink辅助方法类似,但它不是以HTML标记形式返回构建URL,而是以字符串形式返回这些URL。...对此,有三个辅助方法: Action Content RouteUrl Action辅助方法与ActionLink非常类似,但是它不返回锚标签。...部分视图 @Html.Partial("AlbumDisplay") RenderPartial辅助方法与Partial非常相似,但RenderPartial不是返回字符串,而是直接写入响应输出流。

    3K30

    精通MVC3摘译(2)-生成URL

    处理发来URL只是MVC中部分,我们也需要生成一些URL植入到我们view中,让用户点击,并提交表单到目标controller和action,下面会介绍一些生成URL技巧。...ActionLink方法生成HTML基于当前路由模式。...我们可以改变路由模式,让视图中生成URL链接自动改变。 应用程序通常都有多个路由,理解如何选择路由生成URL非常重要。路由系统处理路由,按照他们被加入RouteCollection对象顺序。...当我们描述路由匹配生成URL方法时,我们提到,尝试查找每个路由URL模式片段时,路由系统会从当前请求中查找值,这个行为让很多程序困惑。...这还不只,路由系统将这一技术作为他自己匹配方法部分。路由系统会为某些片段值重用URL模式中出现值,这些片段变量必须是比 Html.ActionLink 方法中提供其他参数先出现。

    81410

    ASP.NET MVC使用Bootstrap系列(3)——使用Bootstrap 组件

    为了更好展示Bootstrap导航条,我ASP.NET MVC_Layout.cshtml布局页创建一个fixed-top导航条,当然它是响应式——小尺寸、低分辨率设备上打开时,它将会只展示一个按钮并带有...(_BackendMenuPartial和LoginPartial)来生成余下导航条(使用.navbar-collapse类低分辨率设备中折叠),其中局部视图逻辑是基于当前访问用户是否登陆来控制是否显示...导航条作为整个网站公共部分,要实现快速搜索那么必须要知道当前所处于哪个Controller,这样才能提高检索效率。...上面的搜索为我们重定向到Result视图,在此视图中,它为我们显示了搜索结果,为了更好展示结果,我们可以使用列表组来显示搜索到产品,视图代码如下所示: @model IEnumerable<Bootstrap.Data.Models.Products...视图代码如下所示: 员工搜索结果: 搜索条件: "@ViewBag.SearchQuery

    6.5K100

    ASP.NET MVC学习笔记03视图

    用Razor编写一个视图模板文件时,将 所需字符和键盘敲击数量降到了最低,并实现了快速,流畅编码工作流程。 ---- 控制器返回指定视图 当前控制器类中Index方法返回了一个硬编码字符串。...视图布局 选择页面的布局,这里就选择默认提供基于Bootstrap一个布局模板_Layout.cshtml.当然,实际项目中,你可以提前搭建好布局页面,并使用布局功能来实现整体站点风格统一,在后面会提到...控制器Index方法中并没有做太多工 作,它只是执行了return View(),这个方法指定使用一个视图模板文件来Render返回给浏览器HTML。...布局模板页面内修改ActionLink内容, 把网站标题从 “应用程序名称“ 修改为 “MVC Movie。参考上图,保存运行。 ?...修改视图 通过修改布局模板上站点标题后缀,ActionLink文本内容,修改了站点标题,站点名称,以及版权说明中通用部分,并适配到了所有的页面。

    2.1K30

    ASP.NET MVC 5 - 视图

    用Razor编写一个视图模板文件时,将所需字符和键盘敲击数量降到了最低,并实现了快速,流畅编码工作流程。 当前控制器类中Index方法返回了一个硬编码字符串。...您控制器Index方法中并没有做太多工作,它只是执行了return View(),这个方法指定使用一个视图模板文件来Render返回给浏览器HTML。...让它们稍有不同,这样就可以看出到底程序里那部分代码被修改了。...按 Ctrl + F5 强制浏览器重新请求并加载服务器返回HTML) Index.cshtml视图模版中设置ViewBag.Title 输出了浏览器标题,附加"- Movie App"是布局模板文件中添加...视图是数据展示方式,掌握这部分知识才能更好用于MVC开发。同时,还可以借助一些开发工具来帮助开发过程。

    3.2K80

    探寻ASP.NET MVC鲜为人知奥秘(3):寻找多语言最佳实践方式

    然后Models中添加一个示例模型类: public class Employee { [Display(Name = "Name", ResourceType = typeof...注意:这里资源因为需要在项目外部使用,所以需要将访问修饰符修改为Public 接下来就是如何来确定访问者要使用语言了,每个请求中,都会有一个Accept-language头,其中定义了可接受语言类型...,但是我们仅可以从它来判断浏览器中设置语言,而这个语言类型可能并不是访问者实际需要语言类型,所以,我们将设计一个可供选择语言列表,然后服务器端使用发回Cookie方式保存浏览器端实际需要语言...,使用PS命令,安装Bootstrap对RightToLeft文字习惯支持: Install-Package Twitter.Bootstrap.RTL 然后App_Start中BundleConfig.cs...,自动提交*@ @section Scripts { @Scripts.Render("~/bundles/jqueryval") <script type="text/javascript

    89280

    ASP.NET MVC 5 - 验证编辑方法(Edit method)和编辑视图(Edit view)

    Edit(编辑)链接是由Views\Movies\Index.cshtml视图Html.ActionLink方法所生成 @Html.ActionLink("Edit", "Edit", new...HttpGet Edit方法会获取电影ID参数、 查找影片使用Entity Framework Find方法,并返回到选定影片编辑视图。...Edit.cshtml视图模板中Html.ValidationMessageFor Helper将用来显示相应错误消息。 ? 所有HttpGet方法遵循类似的模式。...HTTP GET方法中修改数据也违反HTTP最佳实践和REST模式架构,指明GET请求不应该改变你应用程序状态。...(使用 Distinct修饰符,不会添加重复流派 -- 例如,我们示例中添加了两次喜剧)。 该代码然后ViewBag对象中存储了流派数据列表。

    6.7K110

    MVC5 Entity Framework学习之异步和存储过程

    为什么要使用异步代码 一个web服务器可用线程是有限高负载情况下,所有的可用线程可能都在被使用。当出现这种情况时,服务器将无法处理新请求,直到有线程被释放。...将返回类型由ActionResult更改为Task,Task类型表示正在进行工作会返回T类型结果。...await关键字用于web服务调用,当编译器看到该关键字时,会将该方法分为两个部分:第一部分在异步操作开始时结束,第二部分被放入一个回调方法,并在操作完成时被调用。...,HttpPost Edit和DeleteConfirmed方法中,调用SaveChanges方法时会引起命令执行,而像db.Department.Add(department)方法仅仅是在内存中修改实体...Create, Delete,,Details和Edit视图中,将InstructorID字段标题修改为Administrator Create 和Edit视图中使用下面的代码 <label class

    1.3K90

    HtmlHelper(辅助产生HTML之用)

    弱类型: 1.使用HTML辅助方法输出超链接 (1)View中输出ASP.NET MVC超链接通常会用Html.ActionLink辅助方法,该方法用于产生文字链接,其文字部分会自动进行HTML编码...(HtmlEncode) 语法范例 说明 @Html.ActionLink("链接文字","ActionName") 这是最基本用法,要跳转控制器为本视图所在控制器。...",new{id=123,page=5}) 当需要设定额外RouteValue时,可以第三个参数传入object类型数据 @Html.ActionLink("链接文字","ActionName",...请注意:由于HTML标签里套用CSS样式类型时会用到class属性名称,而在C#里class属于关键字,所以必须使用@class方式,才能确保C#正确编译。...ASP.NET MVC还有另一个Html.RouteLink辅助方法,其用法与Html.ActionLink非常相似,差别仅在于输入参数要以RouteValue为主。

    1.1K30

    09.Django基础七之Ajax

    AJAX 不是新编程语言,而是一种使用现有标准新方法。     AJAX 最大优点是不重新加载整个页面的情况下,可以与服务器交换数据并更新部分网页内容。...同样也不难解释,为什么ajax请求时,需要从cookie中拿取token添加到请求头中。...验证码:用户提交每一个表单中使用一个随机验证码,让用户文本框中填写图片上随机字符串,并且提交表单后对其进行检测。...这就用到了我们前面的视图函数中那个JsonResponse了,看博客,里面response部分   还要注意ajaxdata参数:     data参数中键值对,如果值值不为字符串,需要将其转换成字符串类型...简单请求:一次请求 非简单请求:两次请求,发送数据之前会先发一次请求用于做“预检”,只有“预检”通过后才再发送一次请求用于数据传输。

    3.6K20

    ASP.NET MVC编程——视图

    每一行前面加上“@:” 5)使用注释 使用@*和*@将要注释部分包起来 6)用@@页面上显示@ @using 一个View中引入此页所需程序集命名空间。...呈现分部视图返回HTML Html.Action 调用控制器操作呈现分部视图 Html.RenderAction 以内联方式显示结果 3 Url辅助方法 返回URI字符串 Url.Action...视图放在Views文件夹下 Views文件夹子文件夹名称为控制器名称 视图名称可以是控制器操作方法名称也可以不是,若不是控制器操作方法名称,控制器返回视图时要指定视图名。...js文件,那么可以使用_LayoutOther.cshtml视图中定义section 节来加载只有此页面使用js文件,而把公共js文件放在_Layout.cshtml视图文件中 例如Index.cshtml...6加载分部视图 1)控制器返回分部视图 配合@Html.Action方法使用控制器操作返回分部视图 视图中使用@Html.Action("TestPy"),控制器如下 public ActionResult

    3K100

    动手实践:美化 Jenkins 报告插件用户界面

    Jenkins 视图中,我们具有固定页眉和页脚以及左侧导航栏(水平空间20%)。屏幕其余部分可由详细信息视图使用。为了简化剩余空间中元素分布,我们使用 Bootstrap 栅格系统。...使用此基于 JS 表控件可免费提供其他功能: 通过文本搜索过滤结果 提供结果集分页 一次按多列排序数据 使用 Ajax 调用获取表行 根据屏幕分辨率显示和隐藏列 为了视图中使用 DataTables...插件中找到此类表格示例:此处表格列出了 Git 存储库中文件以及相应提交统计信息(作者数量、提交数量、最后修改、首次提交)。... 用自己 ID 替换上面代码 ID 您需要为表提供唯一参数是 model,它通常是对应 Jenkins 视图模型类部分(此对象视图中用${it}引用)。... Forensics 插件中,我使用此图表来显示 Git 存储库中源代码文件作者或提交数量数字比例(请参见图 8)。

    6.1K10

    自创Web框架之过度Django框架

    可以理解为基于浏览器一些应用程序,用户只需要有浏览器即可,不需要再安装其他软件; 比如我们打开一个URL,Web服务器返回一个HTML页面给你,那么你搜索或者URL拼接路径搜索时候Web服务器是怎么知道要返回什么给你...post:向服务器提交数据,比如用户登录输入用户名和密码后,提交到后端做身份校验 响应格式、 响应首行(http协议版本,网络请求方法) 响应头(一大堆k,v键值对) /r/n #...:向别人(服务器)索要数据 post请求:向别人提交数据(比如表单) Web框架之“撸起袖子加油干” 为了更方便理解请求网页并返回数据过程,写一套下面的程序帮助理解 import socket.../3.4.1/css/bootstrap.min.css" rel="stylesheet"> <script src="https://cdn.bootcdn.net/<em>ajax</em>/libs/twitter-<em>bootstrap</em>

    52710
    领券