web-dev-qa-db-ja.com

Page_ClientValidate()と複数のValidationGroups-複数のサマリーを同時に表示する方法は?

ASP.NET 2.0。 2つの検証グループvalGrpOneとvalGrpTwoがあるとします。 2つの検証サマリーvalSummOneおよびvalSummTwo。セクションを分割する理由は純粋に美的です。両方のグループの検証をトリガーする1つの送信ボタン。

ここで、クライアント側の検証をトリガーし、両方の検証の概要を同時に表示したいと思います。

したがって、btnSubmitで呼び出されるJavascript関数をセットアップし、この関数内でPage_ClientValidate("valGrpOne")Page_ClientValidate("valGrpTwo")を続けて呼び出します。問題は、一度に1つの要約のみが表示されることです(ただし、両方を表示する必要があります!)

クライアント側のコードから、両方の検証サマリーを同時に表示する方法に関するアイデアはありますか?

サーバー側に答える次の質問に非常に似ています。 1つのボタンで複数の検証グループをトリガーしますか?

24
joedotnot

わかりましたので、答えは単純ではありませんでした。クライアント側の検証のデフォルトの動作は、検証されたばかりの最新のグループ/要約のみを表示することです。しかし、Javascriptの少しの変更が私に受け入れられる答えを与えました。

自由に改善を提供してください。

   <script type="text/javascript" language="javascript">
    /* Manual client-side validation of Validator Groups */
    function fnJSOnFormSubmit() {
        var isGrpOneValid = Page_ClientValidate("valGrpOne");
        var isGrpTwoValid = Page_ClientValidate("valGrpTwo");

        var i;
        for (i = 0; i < Page_Validators.length; i++) { 
            ValidatorValidate(Page_Validators[i]); //this forces validation in all groups
        }

        //display all summaries.
        for (i = 0; i < Page_ValidationSummaries.length; i++) {
            summary = Page_ValidationSummaries[i];
            //does this summary need to be displayed?
            if (fnJSDisplaySummary(summary.validationGroup)) {
                summary.style.display = ""; //"none"; "inline";
            }
        }

        if (isGrpOneValid && isGrpTwoValid)
            return true; //postback only when BOTH validations pass.
        else
            return false;
    }


    /* determines if a Validation Summary for a given group needs to display */
    function fnJSDisplaySummary(valGrp) {
        var rtnVal = false; 
        for (i = 0; i < Page_Validators.length; i++) {
            if (Page_Validators[i].validationGroup == valGrp) { 
                if (!Page_Validators[i].isvalid) { //at least one is not valid.
                    rtnVal = true;
                    break; //exit for-loop, we are done.
                }
            }
        }
        return rtnVal;
    }
</script>
31
joedotnot

これは、複数のグループに対して検証するためのもう1つの単純で一般的な方法です。

// Page_ClientValidate only shows errors from the last validation group.  
// This method allows showing for multiple groups
function Page_ClientValidateMultiple(groups) {
    var invalidIdxs = [];
    var result = true;

    // run validation from each group and remember failures
    for (var g = 0; g < groups.length; g++) {
        result = Page_ClientValidate(groups[g]) && result;
        for (var v = 0; v < Page_Validators.length; v++)
            if (!Page_Validators[v].isvalid)
                invalidIdxs.Push(v);
    }

    // re-show any failures
    for (var i = 0; i < invalidIdxs.length; i++) {
        ValidatorValidate(Page_Validators[invalidIdxs[i]]);
    }

    // return false if any of the groups failed
    return result;
};
5
Colin Rhodes

Not完全にテスト済み:

/* Manual client-side validation of Validator Groups - Remix */
function PageValidate() {
    var PageIsValid = true;

    for (var validator in Page_Validators) { 
        ValidatorValidate(validator);
        PageIsValid = PageIsValid && validator.isvalid;
    }

    if (PageIsValid) {
        return true; //postback only when ALL validations pass.
    }
    else {
        return false;
    }
}

/* This also does something similar */
function PageValidate() {
    return Page_ClientValidate();
}
3
Alpha
<b>Lets Say here is u r link button</b>
<asp:LinkButton ID="lnkbtnSubmit" runat="server" OnClientClick="return fnJSOnFormSubmit();" meta:resourcekey="lnkbtnSubmitResource1">Submit</asp:LinkButton>
<b> And u r Script is</b>
<script type="text/javascript">


    function confirmAction() {
        var retVal = confirm("Are you sure want to continue ?");
        if (retVal == true) {

            return true;
        }
        else {

            return false;
        }
    }

    function fnJSOnFormSubmit() {
        var isGrpOneValid = Page_ClientValidate("updateuser");
        var isGrpTwoValid = Page_ClientValidate("BaseKey");

        var i;
        for (i = 0; i < Page_Validators.length; i++) {
            ValidatorValidate(Page_Validators[i]); //this forces validation in all groups
        }

        isGrpOneValid = Page_ClientValidate("updateuser");
        isGrpTwoValid = Page_ClientValidate("BaseKey");

        i =0;
        for (i = 0; i < Page_Validators.length; i++) {
            ValidatorValidate(Page_Validators[i]); //this forces validation in all groups
        }

        if (isGrpOneValid && isGrpTwoValid)
            return true; //postback only when BOTH validations pass.
        else
            return false;
    }


    /* determines if a Validation Summary for a given group needs to display */
    function fnJSDisplaySummary(valGrp) {
        var rtnVal = false;
        for (i = 0; i < Page_Validators.length; i++) {
            if (Page_Validators[i].validationGroup == valGrp) {
                if (!Page_Validators[i].isvalid) { //at least one is not valid.
                    rtnVal = true;
                    break; //exit for-loop, we are done.
                }
            }
        }
        return rtnVal;
    }




</script>
0
user2306455

これはjoedotnotの便利なコードの拡張です。 asp.netユーザーの大多数にとってはやり過ぎですが、これは、どのボタンが選択されたかに応じて、検証グループのさまざまな組み合わせを送信時に適用する必要があるプロジェクトに役立ちました。

  var validationManager = function () {
        // Manual client-side validation of Validator Groups 
        // an empty string('') is default - to validate controls without a validation group
        var valGroups = [''],
        returnObj = { //define methods
            set: function (/*string argument list*/) {
                valGroups = Array.prototype.slice.call(arguments);
                return returnObj;
            },
            add: function (/*string argument list*/) {
                var i;
                for (i = 0; i < arguments.length; i++) {
                    if (valGroups.indexOf(arguments[i]) === -1) {
                        valGroups.Push(arguments[i]);
                    }
                }
                return returnObj;
            },
            remove: function (/*string argument list*/) {
                var i = 0, n = 0;
                for (i = 0; i < arguments.length; i++) {
                    var n = valGroups.indexOf(arguments[i]);
                    if (n > -1) valGroups.splice(n, 1);
                }
                return returnObj;
            },
            validate: function () {
                var i = 0,
                    summariesToDisplay = [];
                for (; i < valGroups.length; i++) {
                if (!Page_ClientValidate(valGroups[i])) { //this will display the contents of the validator
                   summariesToDisplay.Push(valGroups[i]);
                  }
                }
                if (!summariesToDisplay.length) { return true; }
                for (i = 0; i < Page_ValidationSummaries.length; i++) { //make relevant summaries visible
                if (summariesToDisplay.indexOf(Page_ValidationSummaries[i].validationGroup || '') > -1) {
                      Page_ValidationSummaries[i].style.display = "inline"; //"none"; "inline";
                    }
                }
                return false;
            }
         };
        if (arguments.length > 0) {
            returnObj.set.apply(null, arguments);
        }
        return returnObj;
    }

次に、さまざまなイベントハンドラで:

    //set up a global object
    var validateOnSubmit = validationManager('','BMIvalGrp');

    //within a radio click handler
    validateOnSubmit.add('weightValGrp','ageValGrp')
                    .remove('BMIvalGrp');

    //added to submit button handlers
    validateOnSubmit.validate();
0
Brent

ここでは、シンプルに保つために、非常にシンプルな例を示します。

以下のJavaScriptメソッドをページヘッダーに含めます。

<script type="text/javascript" language="javascript">
function ShowModalDialog4Validations() {
    var x = $find("modalPopupExtenderValidations");
    Page_ClientValidate("vgValidations");
    if (!Page_IsValid)
        x.show();
}

modalPopupExtenderValidationsは、モーダルポップアップのIDです。 vgValidationsは、検証グループのIDです。

次に、ページプリレンダリングメソッドで、検証を実行するボタンにonclick属性を追加します。

protected void Page_PreRender(object sender, EventArgs e)
    {
        btnMyButton.Attributes.Add("onclick", "ShowModalDialog4Validations();");
    }

わかりやすいといいですね。

さようなら。

0
mdhameed