FormHelper

形成助手

＃1 ASP.NET核心MVC的表格库

如果您喜欢这个图书馆并想支持它，请给星星。

ASP.NET核心MVC的形式和验证助手

形式的帮助者可以帮助您在不编写任何JavaScript代码的情况下创建AJAX表单和验证。它将服务器端验证转换为客户端。您也可以使用无ajax的表单验证器。

与流利验证兼容✅

（您可以将客户端验证支持添加到Fluent验证中。）

安装

可以使用Nuget软件包管理器或Dotnet CLI安装FormHelper 。

软件包管理器：

 Install-Package FormHelper

dotnet cli：

 dotnet add package FormHelper

该图书馆与jQuery一起使用

CDN：

FormHelper .min.js/css to debug. –>
<!– The bundle file includes jQuery validation and jQuery validation unobtrusive –>

<link rel="stylesheet" href="/ FormHelper / FormHelper .min.css" />
<script src="/ FormHelper / FormHelper .bundle.min.js"></script>\”>

 <!-- form helper - You don\'t need to add these files to your project, just add it. it\'s embeded! -->
<!-- if you dont\'t want to use these embeded files, you can download the files from dist folder -->
<!-- You can use FormHelper .js/css instead of FormHelper .min.js/css to debug. -->
<!-- The bundle file includes jQuery validation and jQuery validation unobtrusive -->

< link rel =\" stylesheet \" href =\" / FormHelper / FormHelper .min.css \" />
< script src =\" / FormHelper / FormHelper .bundle.min.js \" > </ script > 

用法

startup.cs

配置服务：

 services.AddControllersWithViews().Add FormHelper ();

使用配置：（可选）

FormHelper(options => {
options.CheckTheFormFieldsMessage = "Your custom message…";
options.RedirectDelay = 6000;
options.EmbeddedFiles = true;
options.ToastrDefaultPosition = ToastrPosition.TopFullWidth;
});\”>

 services.AddControllersWithViews().Add FormHelper (options => {
    options.CheckTheFormFieldsMessage = \"Your custom message...\";
    options.RedirectDelay = 6000;
    options.EmbeddedFiles = true;
    options.ToastrDefaultPosition = ToastrPosition.TopFullWidth;
});

配置：

FormHelper();\”>

 <!-- If you want to use embeded form helper files, add this line -->
app.Use FormHelper ();

viewimports.cshtml

FormHelper
@addTagHelper *, FormHelper \”>

 @using FormHelper
@addTagHelper * , FormHelper

查看：（ taghelper）

FormHelper="true" asp-controller="Home" asp-action="Save">
// <input…
// …
</form>

// You can use <form asp- FormHelper ="true"> or < FormHelper > to activate FormHelper .
// Optional parameters:
// asp-callback="javascriptFunctionName", asp-beforeSubmit="javascriptFunctionName", asp-dataType="FormData/Json", asp-enableButtonAfterSuccess="false", asp-resetFormAfterSuccess="true" asp-toastrPosition="ToastrPosition.BottomRight"\”>

 < form asp - FormHelper = \"true\" asp - controller = \"Home\" asp - action = \"Save\" >
   // <input...
   // ...
< / form >

// You can use <form asp- FormHelper =\"true\"> or < FormHelper > to activate FormHelper .
// Optional parameters:
// asp-callback=\"javascriptFunctionName\", asp-beforeSubmit=\"javascriptFunctionName\", asp-dataType=\"FormData/Json\", asp-enableButtonAfterSuccess=\"false\", asp-resetFormAfterSuccess=\"true\" asp-toastrPosition=\"ToastrPosition.BottomRight\"

控制器：

 [ FormValidator ]
public IActionResult Save ( FormViewModel viewModel )

// If you use Json data type, you need to add [FromBody] attribute.
// public IActionResult Save([FromBody]FormViewModel viewModel)

返回控制器的结果：

错误信息：

 return FormResult.CreateErrorResult(\"An error occured.\");

成功消息：

 return FormResult.CreateSuccessResult(\"Product saved.\");

与重定向的成功消息：

 return FormResult.CreateSuccessResult(\"Product saved. Please wait...\", Url.Action(\"Home\", \"Index\"));

重定向和延迟时间的成功消息：

 return FormResult.CreateSuccessResult(\"Product saved. Please wait...\", Url.Action(\"Home\", \"Index\"), 10000); // 10 seconds

从JSON对象填充表单字段：

 $(\"#formId\").fillFormFields(yourJsonObject);

重置表单和清晰的错误消息：

 $(\"#formId\").fhReset();

toastr：

成功：

 fhToastr.success(\"Text here\");

警告：

 fhToastr.warning(\"Text here\");

信息：

 fhToastr.information(\"Text here\");

错误：

 fhToastr.error(\"Text here\");