HTML、CSS、およびJS(依存関係:jQueryと検証)だけで自分のサイトの作業用jQuery.validationフォームを作成しました。問題は、私がクリーンなASP.NET Core Webプロジェクトに入っていて、まったく同じコードを使用していて、JavaScriptでカスタム検証パラメータを使用していないような場合です。jQuery.validateはASP.NETコアでは機能しません
すべてのケースで有効です。 JSFiddle
HTML::
<form method="post">
<fieldset>
<div class="master">
<input name="name" id="name" placeholder="Name" minlength="2" maxlength="40" required />
</div>
<div class="master">
<input name="email" id="email" placeholder="Email Address" type="email" required />
</div>
<div class="master">
<input name="company" placeholder="Company Name" />
</div>
<div class="master">
<input name="website" placeholder="Website" type="url" required />
</div>
<button type="submit">Next</button>
</fieldset>
</form>
CSS:
しかし、.validate([options])
のための私のカスタム
[options]
は、作業コードのASP.NETコア
例では動作していないようです
.master {
padding: 10px;
background-color: white;
}
.has-error {
background-color: red;
}
.has-success {
background-color: green;
}
JS:
$('form').validate({
// This disables the default validation notifications to the user.
// Instead I'll be using CSS colors to notify users of valid or invalid fields
errorPlacement: function (error, element) { },
// Invalid field produces a red-background in parent element
highlight: function(element) {
$(element).parent().addClass('has-error').removeClass('has-success');
},
// Valid field produces a green-background in parent element
unhighlight: function(element) {
$(element).parent().removeClass('has-error').addClass('has-success');
}
});
私はJavaScript .validate([options])
は3つの事を行います。
<field>
がINVALID、親要素の背景色が赤 されている
- 場合jQuery.validationのデフォルトの通知オプションを削除
<field>
がの場合VALID、親要素の背景色が緑ある
注:
- は、最新の安定版ダウングレード
- に私のASP.NETコア(1.1)を更新しましたテストするASP.NETコア1.0へ
- のjQueryの検証のウェブサイト特定のバージョンによると
- (テスト用)亭、ローカルおよびCDNを経由して、最新の検証を追加しました
- (テスト用)亭、ローカルおよびCDN経由でjQueryの最新情報を追加しましたために使用する必要があります互換性。私は
ローカルとCDN亭を経由してすべてのバージョンは、JSFiddle、CodePenとローカルに(
依存性がを含む)取り除かすべてと生HTML、CSSやJSのバージョンを作ったテスト。
すべてが完全にで動作しましたが、ASPプロジェクトでは動作しませんでした。
- 外部またはインラインJavaScript、変更はありません。
私の結論: は検証がASP.NET CoreアプリケーションとプレーンHTMLの両方を意味し、すべての場合に動作します - CSS - JS適切に機能検証を持っています。
唯一のことが動作しないは、[options]
を$('form').validate([options]);
にASP.NET Coreアプリケーションで提供するときです。なぜ私のオプションが使われていないのか分かりません。 .validate([options])
これは、ASP.Net(Coreまたはそれ以外の)それ自体がスクリプト/ css(パスなど)を参照するよりもそれ自体が何かをしていることは間違いありません。終わりのクライアントはクライアント、サーバーはサーバーです(後者はASP.Netのすべての味を再生します)。 – EdSF