ASP.Net Core中使用jquery-ajax-unobtrusive替換Ajax.BeginForm

 

在大潮流下，你們都在研究MVVM框架，可是作面向搜索引擎的外網項目仍是得用服務器渲染。

在.Net中確定就是用Razor模板引擎了。

.Net Core斷臂式重構後，不少在老得Mvc中使用得好好的一些功能，忽然就不見了。

在這裏鄙視一下微軟，說好的無縫切換呢。。我看這個縫仍是有點大。

ASP.Net Core中，使用TagHelper替換HtmlHelper。使得寫出的Razor代碼可讀性更高，同時VS的提示能力更強了。

可是也丟掉了不少之前以爲很好用的東西，好比今天要說的Ajax.BeginForm，在ASP.Net Core中忽然就不見了，搜索GitHub的Issue，發現官方不打算支持Ajax.BeginForm了。後續也無開發計劃，那個issue直接被關閉了。

雖然沒了Ajax.BeginForm。可是在牆外搜索到另外一種TagHelper的實現。

直接在form上使用data-*去作異步表單，使用方式和Ajax.BeginForm半斤八兩

https://github.com/aspnet/jquery-ajax-unobtrusive

去GitHub下載這個項目，而後點擊build.cmd，腳本自動構建一個dilst，裏面就是js文件

而後引用到項目中。就能夠愉快的編寫異步表單辣

<form asp-controller="Home" asp-action="Test" data-ajax="true" data-ajax-method="post" data-ajax-begin="begin" data-ajax-success="success">
    <label asp-for="UserName"></label>:
    <input asp-for="UserName" />
    <span asp-validation-for="UserName"></span>
    <br />
    <label asp-for="PassWord"></label>:
    <input asp-for="PassWord" />
    <span asp-validation-for="PassWord"></span>
    <button type="submit">Ok</button>
</form

  <script>
        var begin = function () {
            console.log("begin"); } var success = function (context) { console.log(context) } </script>

 

這裏提供了N多個data-ajax-*的taghelper，

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

好了，就醬紫了