jQuery 検証のサンプル コードにより検証が簡単になります_jquery

クライアント側検証を使用すると、サーバーとクライアント間のデータ トリップの数を効果的に減らすことができ、サーバーのリソース使用率の向上に有益であり、ユーザーに直観的かつ迅速な応答を提供することもできます。 Web 2.0 の時代では、これは特に重要です。私と同じように、誰もが基本的な JavaScript で書かれた面倒な検証を嫌うはずです。現在では、サーバー側の検証用の優れたフレームワークがあり、ASP.NET MVC はこのような作業を非常にうまく実行できます。そのため、.net 開発では、優れたクライアント側のメンテナンス フレームワークが開発効率の向上に重要な役割を果たします。

この JS フレームワークは次のアドレスから入手できます

• JQuery
  
• jQuery 検証フレームワーク
  

簡単な例から jクエリ検証フレームワーク の理解を始めましょう

まず、上記 2 つの JS ファイルへの参照を追加する必要があります

コードをコピーします コードは次のとおりです:

次に、次の HTML セグメントを宣言します

コードをコピーします コードは次のとおりです:

名:
姓:

上記のコードにより、class= が追加されたことがわかります。各入力に「必須」を入力します。その機能は、入力タグが空の場合にユーザーにエラーを要求することです。
最後に、フレームワークのエントリ ポイントを見つける必要があります。通常は、HTML の最後に次のコードを配置します。

コードをコピー コードは次のとおりです:

実行して動作を確認してください

ListBox コントロールの定期的な検証を作成するための以下の大きな例を見てください次のようなルールを追加できます

コードをコピー コードは次のとおりです:

$("#customerForm").validate(

{
rules:
{
FirstName: { required:true }、
姓 : { required:true }、
国: { validateCountries:true }
}、
メッセージ:
{
名: { 必須: "名は必須です" },
LastName: { 必須: "姓は必須です" },
国: { validateCountries:"国から少なくとも 2 つの項目を選択してください" }
},

});
// 国の検証メソッドを追加します
jQuery.validator.addMethod("validateCountries", function(value, element)
{
var noOfSelectedCountries = $("#国 :selected").length;
if(noOfSelectedCountries < 2) return false;
return true;
});

提供エラーエラーの情報

コードをコピー コードは次のとおりです:

$("#customerForm").validate(
{
rules:
{
FirstName: { required:true },
LastName: { required:true } ,
Countries: { validateCountries:true }
},

messages:
{
FirstName: { required: "First Name is required" },
LastName: { required: "Last Name is required" },
Countries: { validateCountries:"Please select at least 2 items from the Countries" }
},

errorContainer:"#errors",
errorLabelContainer:"#errors ul",
wrapper:"li"

});

See the picture below for the effect

Okay, not much to say. This article provides source code download. Study it yourself. It’s very late. 🎜>