ユーザーがフォームを送信すると、ページ内の他のコントロールをクリックできないようにするフリーズ パネルがあります。これは、MVC サービス コントローラーに設定された属性からフォーム コントロールを検証することで正常に機能します。
問題は、ユーザーがアカウント名と @ 記号の間にスペースを入れて電子メール アドレスを入力した場合 (someName @email.com) です。電子メールのテキスト ボックスを指しているエラー メッセージを検証する小さな白いポップアップ ボックスが表示されます。Create コントローラー メソッドが起動しないため、jQuery によるものだと思います。大きな問題は、フリーズ パネルが所定の位置にとどまるため、ページを更新するまで問題を修正できないことです。
jQueryに関しては初心者で、この問題を修正する方法を失いました。フリーズ ペインの css プロパティを非表示の状態に戻すことができるように、jQuery が不正な電子メール アドレスの検証例外をいつ発生させたかを特定する必要があると推測しています。
どんな助けも大いに例外です!
私のモデル クラスには、電子メール用のこのプロパティがあります。
[Required(ErrorMessage = "Email required")]
[StringLength(125), EmailAddress(), Display(Name = "Email Address")]
public string Email { get; set; }
私のコントローラーには、この単純な create メソッドがあります。
[HttpPost]
public ActionResult Create(ClientService clientservice)
{
if (ModelState.IsValid)
{
context.ClientServices.Add(clientservice);
context.SaveChanges();
return RedirectToAction("Completed");
}
return View("Create");
}
私の作成ビュー 入力コントロールを含む部分ビューと、パネルを制御するフリーズ ペイン div および jQuery スクリプトをロードするこのコードがあります。
@using (Html.BeginForm()) {
@Html.ValidationSummary(true)
<fieldset class="user-input">
<legend>Client Service</legend>
<h2 class="margin-indent">How to contact -</h2><br />
@Html.Partial("_CreateOrEdit", Model)
<p class="margin-indent">
<input id="pageSubmit" type="submit" value="Submit" />
</p>
</fieldset>
}
<div id="FreezePane" class="FreezePaneOff">
<div id="InnerFreezePane" class="InnerFreezePane"> </div>
</div>
<script type="text/javascript">
$(function () {
$('#pageSubmit').click(function (event) {
var itemErrors = validator.numberOfInvalids();
if (itemErrors >= 1) {
event.preventDefault();
} else {
$('html,body').scrollTop(10);
$('#FreezePane').toggleClass('FreezePaneOn');
$('#InnerFreezePane').text("Processing...");
}
});
</script>