フォームを送信する前に、ユーザーからの入力フィールド値を検証する必要があります。
カスタムコントローラーでアクションを作成し、それでフィールドを装飾しました。
アクション名:CheckValue
コントローラー名:Validate
_[Remote("CheckValue", "Validate"), ErrorMessage="Value is not valid"]
public string Value { get; set; }
_
問題は、送信ボタンを押したときにフォームが送信され、ユーザーが入力した値が有効でない場合にメッセージ_Value is not valid
_が表示されることです。
ユーザーが入力した値を検証し、値が無効な場合にフォームが送信されないようにし、エラーメッセージを表示するにはどうすればよいですか?
JavaScriptでフォームがtrueを返す有効な$("#formId").valid()
であるかどうかを確認しようとすると、値のステータス(有効または無効)が何であってもフォームが有効であることを意味します。
一方、別のフィールドを_[Required]
_属性で装飾すると、フォームは送信されず、そのフィールドに必要なエラーが表示されます。ただし、リモート検証フィールドの検証はバックグラウンドで行われません。
MVCのリモート検証の完全なソリューション。電子メールがデータベースに存在するかどうかを確認し、次のエラーを表示します。
メールは既に存在します
アカウントコントローラーアクション
[AllowAnonymous]
[HttpPost]
public ActionResult CheckExistingEmail(string Email)
{
try
{
return Json(!IsEmailExists(Email));
}
catch (Exception ex)
{
return Json(false);
}
}
private bool IsEmailExists(string email)
=> UserManager.FindByEmail(email) != null;
モデル検証の追加
[Required]
[MaxLength(50)]
[EmailAddress(ErrorMessage = "Invalid Email Address")]
[System.Web.Mvc.Remote("CheckExistingEmail", "Account", HttpMethod = "POST", ErrorMessage = "Email already exists")]
public string Email { get; set; }
スクリプトの追加
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
はい、追加する必要があります[Remote]
モデルへ:
[Remote("ActionName", "ControllerName", ErrorMessage = "{0} Is somthing!")]
public string yourproperty { get; set; }
そしてコントローラー:
public JsonResult ActionName(string yourproperty)
{
return Json(!db.yourproperty.Any(lo => lo.yourproperty== yourproperty), JsonRequestBehavior.AllowGet);
}
私にとってはうまくいく。お役に立てば幸いです。
コントローラーコードを入れないでください。ただし、次のようにする必要があります。
あなたのコード:
[Remote("CheckValue", "Validate", ErrorMessage="Value is not valid")]
public string Value { get; set; }
コントローラーの検証コード(検証):
public ActionResult CheckValue(string Value)
{
if (Value == "x value")
{
// This show the error message of validation and stop the submit of the form
return Json(true, JsonRequestBehavior.AllowGet);
}
else
{
// This will ignore the validation and the submit of the form is gone to take place.
return Json(false, JsonRequestBehavior.AllowGet);
}
}
c-sharpcorner demo を参照して
RemoteAttributeを使用できます。
ステップ1
HomeControllerでメソッドを作成し、そのために以下を記述します。
public JsonResult IsUserExists(string UserName)
{
//check if any of the UserName matches the UserName specified in the Parameter using the ANY extension method.
return Json(!db.Users.Any(x => x.UserName == UserName) ,JsonRequestBehavior.AllowGet);
}
なぜJsonResultを返すのか疑問に思われるかもしれません。検証はクライアント側で行われるようにするため、JsonResultを返します。
ステップ2
次のステップでは、このメソッドをユーザー名プロパティに接続します。そのために、モデルフォルダーにクラスファイルを追加し、部分的なユーザークラスを追加し、UserNameプロパティに必要なカスタマイズを提供する必要があります。
using System.ComponentModel.DataAnnotations;
using System.Web.Mvc;
namespace UniqueField.Models
{
[MetadataType(typeof(UserMetaData))]
public partial class User
{
}
class UserMetaData
{
[Remote("IsUserExists","Home",ErrorMessage="User Name already in use")]
public string UserName { get; set; }
}
}
ステップ3
Create.cshtmlでは、3つのjQueryファイルのソースを指定された順序で指定する必要があります。
<h2>Create</h2>
<script src="~/Scripts/jquery-1.10.2.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
既存の答えは素晴らしいですが、いくつかの落とし穴があります。
1)検証メソッドのパラメーター名は、検証されるプロパティの名前と正確に一致する必要があります。にとって
[System.Web.Mvc.Remote("CheckExistingDocumentTypeCode", "DocumentTypes", HttpMethod = "POST", ErrorMessage = "Code already exists")]
public string DocumentTypeCode { get; set; }
検証メソッドのパラメーターは、大文字を含めてDocumentTypeCode
と呼ばれる必要があります。そうでない場合、検証されるプロパティの値の代わりにnullがパラメーターとして取得されます。
[AllowAnonymous]
[HttpPost]
public async Task<ActionResult> CheckExistingDocumentTypeCode(string DocumentTypeCode)
Resharperユーザーである場合、複数のプロパティで使用するための多目的検証メソッドを作成している場合は、特に注意してください。
2)Telerikグリッドでこれを機能させる必要があり、グリッドに検証エラーメッセージを正しく表示するために、少し異なる方法で実装する必要がありました(ここの例では、検証エラーメッセージとして「false」を示しました)。
[AllowAnonymous]
[HttpPost]
public async Task<ActionResult> CheckExistingDocumentTypeCode(string DocumentTypeCode)
{
try
{
if (!await IsDocTypeCodeExists(DocumentTypeCode))
{
return Json(true, JsonRequestBehavior.AllowGet);
}
return Json("This Document Type Code is already in use", JsonRequestBehavior.AllowGet);
}
catch (Exception ex)
{
return Json(ex.ToString(), JsonRequestBehavior.AllowGet);
}
}
MVCのリモート検証
using System.Web.Mvc;
[Required(ErrorMessage = "E-mail is required")]
[RegularExpression(@"^[a-zA-Z0-9_\.-]+@([a-zA-Z0-9-]+\.)+[a-zA-Z]{2,6}$", ErrorMessage = "Email is not valid")]
[StringLength(30, ErrorMessage = "Email must not be more than 30 char")]
[Remote("IsEmailAvailable", "User", ErrorMessage = "E-mail already in use")]
public string Email { get; set; }
[HttpGet]
public JsonResult IsEmailAvailable(string email)
{
// Check if the e-mail already exists
return Json(!db.Users.Any(x => x.Email == email), JsonRequestBehavior.AllowGet);
}
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
また、web.configからクライアント側の検証を有効にします
<appSettings>
<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>
注意:
リモート属性は、JavaScriptが有効な場合にのみ機能します。エンドユーザーが自分のマシンでJavaScriptを無効にすると、検証は機能しません。これは、RemoteAttributeが非同期AJAXサーバー側の検証メソッドの呼び出し。その結果、ユーザーは所定の検証をバイパスしてフォームを送信できます。このため、サーバー側の検証が常に重要です。
JavaScriptが無効になっている場合:
JavaScriptが無効になっている場合、サーバー側の検証を機能させるには2つの方法があります
コントローラーアクションメソッドでモデル検証エラーを動的に追加します。以下に示すように、[HttpPost]属性で装飾されたCreateアクションメソッドを変更します。
[HttpPost]
public ActionResult Create(User user)
{
// Check if the Email already exists, and if it does, add Model validation error
if (db.Users.Any(x => x.Email == user.Email))
{
ModelState.AddModelError("Email", "Email already in use");
}
if (ModelState.IsValid)
{
db.Users.AddObject(user);
db.SaveChanges();
return RedirectToAction("Index");
}
return View(user);
}
この時点で、ブラウザーでJavaScriptを無効にして、アプリケーションをテストします。クライアント側の検証は取得されませんが、フォームを送信するときに、検証エラーがある場合、サーバー側の検証によってユーザーはフォームを送信できません。
ただし、検証を実行する責任をコントローラーアクションメソッドに委任すると、MVC内の懸念事項の分離に違反します。理想的には、すべての検証ロジックはモデル内にある必要があります。検証には、MVCモデルで検証属性を使用することをお勧めします。
スクリプトリンクをコピーして貼り付けるのと同じ問題が発生しました。スクリプトフォルダからjqueryファイルをドラッグアンドドロップしてページを表示すると、この問題が解決することを願っています。