ASP.NET Core中的jQuery Unobtrusive Ajax帮助器
最近在asp.net core下写文章管理系统时,准备在分页显示文章内容时,使用ajax。网上找了篇帖文,简单翻一下,仅供自己查阅。
原链接:https://dotnetthoughts.net/jquery-unobtrusive-ajax-helpers-in-aspnet-core/
原标题:jquery unobtrusive ajax helpers in asp.net core
原作者:anuraj
本贴讲述了如何在asp.net core中获取jquery unobtrusive ajax帮助器。ajaxhelper类为用ajax渲染html视图提供支持。如果你想将现有的asp.net mvc项目迁移到asp.net core mvc,却没有现成的标记帮助器可供替换,取而代之的是asp.net core团队建议使用data-*属性。所有现存的@ajax.form属性都可用于data-*属性。
要使用它,你首先需要引用jquery和jquery.unobtrusive-ajax脚本,可以通过bower下载并安装它。
这是通过bower安装该脚本库的命令:
bower install microsoft.jquery.unobtrusive.ajax
一旦你安装了该脚本,你就可以在_layout.cshtml文件引用它:
<script src="~/lib/microsoft.jquery.unobtrusive.ajax/jquery.unobtrusive-ajax.min.js"></script>
以下是可用于迁移@ajax.form帮助器的属性:
ajaxoptions | html attribute |
confirm | data-ajax-confirm |
httpmethod | data-ajax-method |
insertionmode | data-ajax-mode |
loadingelementduration | data-ajax-loading-duration |
loadingelementid | data-ajax-loading |
onbegin | data-ajax-begin |
oncomplete | data-ajax-complete |
onfailure | data-ajax-failure |
onsuccess | data-ajax-success |
updatetargetid | data-ajax-update |
url | data-ajax-url |
你像这样在表单(form)元素中添加这些属性:
<form asp-controller="home" asp-action="saveform" data-ajax="true" data-ajax-method="post"> </form>
下列代码,将在提交表单时显示进度指示器,一旦完成(oncomplete)、成功(onsuccess)或失败(failed),它将显示警告消息。
var results = $("#results"); var onbegin = function(){ results.html("<img src=\"/images/ajax-loader.gif\" alt=\"loading\" />"); }; var oncomplete = function(){ results.html(""); }; var onsuccess = function(context){ alert(context); }; var onfailed = function(context){ alert("failed"); };
这是html表单:
<form asp-controller="home" asp-action="saveform" data-ajax-begin="onbegin" data-ajax-complete="oncomplete" data-ajax-failure="onfailed" data-ajax-success="onsuccess" data-ajax="true" data-ajax-method="post"> <input type="submit" value="save" class="btn btn-primary" /> <div id="results"></div> </form>
上一篇: 微信支付和微信支付通知基于sdk的说明
下一篇: 长乐培训Day3
推荐阅读
-
jQuery中调用ajax方法时在不同浏览器中遇到的问题
-
Asp.net Core MVC中怎么把二级域名绑定到特定的控制器上
-
服务器开发- Asp.Net Core中的websocket,并封装一个简单的中间件
-
详解如何在ASP.NET Core中编写高效的控制器
-
ASP.NET Core中的jQuery Unobtrusive Ajax帮助器
-
Asp.net Core MVC中怎么把二级域名绑定到特定的控制器上
-
jQuery中调用ajax方法时在不同浏览器中遇到的问题
-
详解如何在ASP.NET Core中编写高效的控制器
-
JQuery Ajax 在asp.net中的使用并调用后台实例讲解
-
浅析jQuery中调用ajax方法时在不同浏览器中遇到的问题_jquery