0

ASP.net (C#) データ検索ページのフィルター フィールドとして、一連のドロップダウン リストと 2 つのテキスト ボックスがあります。ユーザーが最低 2 つの検索フィルターを提供する必要があるように、選択したフィルターを検証する方法を見つけたいと思います。つまり、ユーザーは少なくとも 1 つのドロップダウンを選択し、1 つのテキスト ボックスにテキストを入力するか、2 つのドロップダウンを選択する必要があります。

これを達成するための最良の方法はどれですか?

ありがとう

4

1 に答える 1

1

jQueryを使用している場合は、サーバーに投稿しなくても、jQueryを使用して参照していることを実行できます。

これが私がモックアップした完全なテストページで、値をチェックします。クラスを持つ2つ以上のselect要素がそれ以外の値を持っている限り、そうでない場合、関数はtrueを返します。そうでない場合は、選択されていないボックスが赤になります。また、別のフィルターを選択する必要があることを知らせるエラーメッセージを表示することもできます...またはその程度の何か。SearchSelectnull""

<html>
    <head>
        <title></title>
        <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js"></script>
        <script>
            function CheckFilters() {
                var count = 0;
                $('.SearchSelect').addClass('badSelect');
                $('.SearchSelect').each(function() {
                    var sl = $(this);
                    if (sl.val() != null && sl.val() !== "") {
                        count++;
                        sl.removeClass('badSelect');
                    }
                });
                if (count >= 2) {
                    $('.SearchSelect').removeClass('badSelect');
                    return true;
                } else {
                    return false;
                }
            }
            $(document).ready(function(){
                $('#SubmitButton').click(function(e) {
                    if(!CheckFilters()) e.preventDefault();
                    else alert("Success"); // in your case this line will probably be excluded and you will probably do nothing which will allow the POST/GET request to process
                });
            });
        </script>
        <style>
            .badSelect{
                border: 1px solid red;
            }
        </style>
    </head>
    <body>
        <form>
        <select class="SearchSelect" id="One">
            <option value="">Select A Filter</option>
            <option value="hasValue">Has a Value</option>
        </select><br /> 
        <select class="SearchSelect" id="Two">
            <option value="">Select A Filter</option>
            <option value="hasValue">Has a Value</option>
        </select> <br /> 
        <select class="SearchSelect" id="Three">
            <option value="">Select A Filter</option>
            <option value="hasValue">Has a Value</option>
        </select> <br />
        <button type="button" id="SubmitButton">Submit</button></form>
    </body>
</html>
于 2012-12-15T10:28:51.740 に答える