10

ボタンのタイプが送信である限り、フォーム内で検証を実行できることはわかっています。しかし、ビューには他にもいくつかのタブがあり、送信を使用すると、posback が発生し、最初のタブに戻ります。私はそれが起こらないようにしたくないので、検証を関数に入れ、ボタンの種類をボタンに変更し、フォームタグを削除して、ボタンのクリックイベントで検証関数を呼び出してみましたが、起動しませんでした。フォームタグを使わずにこれを行うことは可能ですか?

私のコードはこれです...

    $(document).ready(function () {
    $("#btnUpdateModerator").click(function () {
        ValidateIt();
    });
    ValidateIt();
});
function ValidateIt() {
    var validator = $("#Users").bootstrapValidator({
        feedbackIcons: {
            valid: "glyphicon glyphicon-ok",
            invalid: "glyphicon glyphicon-remove",
            validating: "glyphicon glyphicon-refresh"
        },
        fields: {
            DealerUsername: {
                message: "Username is required",
                validators: {
                    notEmpty: {
                        message: "Please Provide Username"
                    }
                }
            },
            email: {
                message: "Email address is required",
                validators: {
                    notEmpty: {
                        message: "Please provide Email address"
                    },
                    emailAddress: {
                        message: "Email address was invalid"
                    }
                }
            },
            password: {
                validators: {
                    notEmpty: {
                        message: "Password is required"
                    },
                    stringLength: {
                        min: 6,
                        message: "Password must be at least 6 characters long"
                    },
                    different: {
                        field: "email",
                        message: "Email and Password cannot match"
                    }
                }
            },
            confirmPassword: {
                validators: {
                    notEmpty: {
                        message: "Confirm Password is required"
                    },
                    identical: {
                        field: "password",
                        message: "Password and Confirmation Password must match"
                    }
                }
            },
            department: {
                validators: {
                    notEmpty: {
                        message: "Department is Required"
                    }
                }
            }
        }
    });
}
4

2 に答える 2

15

フォーム要素は残しておく必要があると思いますが、ボタンの種類を「送信」ではなく「ボタン」に設定してください。次に、ブートストラップ バリデータの「validate」メソッドを使用して、フォームを手動で検証できます。

フォーム要素に「Users」があると仮定するとid、コードを次のように変更できるはずです。

$(document).ready(function () {
    $("#btnUpdateModerator").click(function () {
        $('#Users').bootstrapValidator('validate');
    });
    ValidateIt();
});

注：ValidateIt()あなたが書いた関数はフォームを検証しません。フォームにバリデーターを設定します。

注: API ドキュメントは次の場所にあると思います: http://bv.doc.javake.cn/api/

ajax 呼び出しに関するコメントの後に更新します。

ボタンがクリックされたときに ajax 呼び出しを行いたいが、フォームが有効な場合にのみ行う場合は、次のようにすると思います。

    $("#btnUpdateModerator").click(function () {
        $('#Users').bootstrapValidator('validate');
        if ($('#Users').bootstrapValidator('isValid')) {
            // Make the ajax call here.
        }
    });

これを書く別の方法は次のとおりです。

    $("#btnUpdateModerator").click(function () {
        var validator = $('#Users').data('bootstrapValidator');
        validator.validate();
        if (validator.isValid()) {
            // Make the ajax call here.
        }
    });
于 2015-09-05T23:44:10.403 に答える
1

ブートストラップバリデーターはフォームの submit() メソッドにバインドされていると思うので、それを関数に移動しても実際には役に立ちません。ただし、フォームの送信メソッドをインターセプトして、必要になるまで送信を許可しないようにすることはできます。

$("#myForm").submit(function(e){
    e.preventDefault(); // <-- prevents the form from submitting
    // do stuff
    this.submit() // <-- send it through
});
于 2015-09-05T23:39:12.593 に答える