Asp.net Core中的Ajax帮助程序标记文档

时间：2018-05-03 06:37:12

标签： c# jquery ajax asp.net-mvc asp.net-core

Asp.net Core中是否有Ajax帮助程序标记文档的链接。我正在尝试用asp.net核心学习ajax，但我没有找到它的文档。 在asp.net mvc中，我们使用@ Ajax.Form，然后使用AjaxOptions方法处理ajax。经过几个小时的搜索，我发现了这个链接 https://dotnetthoughts.net/jquery-unobtrusive-ajax-helpers-in-aspnet-core/ 在这个链接中有一种方法可以在asp.net核心中使用ajax。 我在我的项目中实现并成功。 然后我搜索它的文档，但我什么也没发现。 我想要它的文档链接。请任何人帮助其文档

3 个答案:

答案 0 :(得分：16)

ASP.NET Core中没有服务器端帮助程序，如@Ajax.Form。您可以为类似功能编写自己的标记帮助程序，但我没有看到有人这样做。一般的想法是当你想要有客户端行为时编写实际的JavaScript。将这些东西隐藏在服务器端魔术背后通常不是最好的主意。

jquery-ajax-unobtrusive是一个JavaScript包，它添加了客户端行为，以在最终呈现的页面中查找各种属性，以便在标准表单之上添加功能。所以这将是一个完全基于JavaScript的解决方案。

不幸的是，似乎没有关于它的文档。您可以查看its source code以找出可能或不可能的内容。

jquery-ajax-unobtrusive文档

从快速查看源代码（免责声明：我自己不测试功能），这似乎是支持的数据属性和软件包的可用功能：

  • data-ajax="true" - 启用表单功能。
  • data-ajax-update - 使用模式使用AJAX结果更新的元素的选择器。
  • data-ajax-mode
  • data-ajax-confirm - 向用户显示提交表单confirm的消息。
  • data-ajax-loading - 加载时显示的元素选择器。
  • data-ajax-loading-duration（默认值：0） - 加载元素的show / hide的动画持续时间。
  • data-ajax-method - 允许覆盖AJAX请求的HTTP方法。
  • data-ajax-url - 允许覆盖AJAX请求的URL。
  • data-ajax-cache - 设置为"true"以外的其他值以禁用jQuery AJAX cache parameter。
  • data-ajax-begin - 请求开始前的回调函数（参数：xhr）
  • data-ajax-complete - 请求完成时的回调函数（参数：xhr，status）
  • data-ajax-success - 请求成功时的回调函数（参数：data，status，xhr）
  • data-ajax-failure - 请求失败时的回调函数（参数：xhr，status，error）

回调函数相当于jQuery的beforeSend，complete，success和failure。从它的外观来看，您可以使用函数的JavaScript对象路径指定回调。

例如data-ajax-success="foo.bar.onSuccess"将调用函数foo.bar.onSuccess()，即它将在foo中查找对象window，获取其bar成员，以及打电话给onSuccess。

答案 1 :(得分：2)

如果您正在寻找 Core 中的旧式 Ajax 助手，这个 Nuget 包可能会有所帮助 -

<块引用>

AspNetCore.Unobtrusive.Ajax

您可以使用 -

安装它 
PM> Install-Package AspNetCore.Unobtrusive.Ajax

这将使您能够使用像这样的助手

@Html.AjaxActionLink()
@Html.AjaxBeginForm()
@Html.AjaxRouteLink()

这是github的详细信息。您可以在那里找到更多文档。

Github Url to the project

答案 2 :(得分：1)

https://github.com/Behrouz-Goudarzi/AjaxTagHelper

AjaxTagHelper

在aspnet核心中使用Tag Helper使用链接和ajax表单的简单解决方案

首先，将AjaxTagHelper类从Extensions文件夹复制到您的项目中。

第二，从wwwroot的js文件夹中复制AjaxTagHelper.js文件，并将其添加到您的项目中。

然后执行以下操作：打开viewImports文件并添加以下代码

dev-master

要使用Action Ajax，请添加以下代码而不是标签。

@using AjaxTagHelper.Extensions
@using AjaxTagHelper
@using AjaxTagHelper.Models
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@addTagHelper *, AjaxTagHelper

使用以下代码使用AJAX将表单发送到服务器。

  <ajax-action ajax-action="Delete" ajax-controller="Home" ajax-data-id="@Model.Id"
                 class="btn btn-danger btn-sm" ajax-success-func="SuccessDelete">
        Delete
    </ajax-action>

最后，添加您需要查看的脚本，检查下面的代码

<div class="row">
    <form id="frmCreate" class="col-sm-9">
        <div class="row">
            <div class="col-sm-4 form-control">
                <input placeholder="Enter Name" name="Name" class="input-group" type="text" />
            </div>
            <div class="col-sm-4 form-control">
                <input placeholder="Enter Family" name="Family" class="input-group" type="text" />
            </div>
            <div class="col-sm-4 form-control">
                <input placeholder="Enter Email@site.com " name="Email" class="input-group" type="email" />
            </div>
        </div>
    </form>
    <div class="col-sm-3">
        <ajax-button ajax-controller="Home" ajax-action="Create" ajax-form-id="frmCreate" ajax-success-func="SuccessCreate"
                     class="btn btn-sm btn-success">
            Create
        </ajax-button>
    </div>
</div>
相关问题
最新问题