0

jquery と php を使用して送信されたフォームを確認しようとしています。データがフォームに入力されているかどうかを検証し、サーバーのコールバック応答に応じてさまざまな操作を実行するために、.ajax 要求をサーバーに送信しています。たとえば、名が入力されていない場合、または姓が入力されていない場合にエラー メッセージを表示します。

問題は、両方が入力されていない場合、エラー メッセージを明らかにせずに、コールバックがメッセージの firstname と lastname を一緒に返すことです。

        // JavaScript Document
        $(function(){
            $("#form").submit(function(event){
                $("#name_alert").css("display,none");
                event.preventDefault();
                  $.ajax({
                      url:'functions/register_user.php',
                      type:"POST",
                      data:$(this).serialize(),
                      success:function(data){  
                           if(data=='true') 
                                {  
                                    $("#form").effect("shake", {times:2}, 600); 
                                    $("#alert").fadeIn("slow");
                                    $("#note").fadeIn("slow").html('<strong>ERROR</strong>: Your details were incorrect.');  
                                }
                            if(data=='name'){
                                    $("#name_alert").fadeIn("fast").effect("shake", {times:1}, 600);
                                    $("#name_note").html('<strong>ERROR</strong>: Your first name must be in the range
                                     of 2 to 20 characters long.'); 
                                }
                            if(data=='surname'){
                                    $("#surname_alert").fadeIn("fast").effect("shake", {times:1}, 600);
                                    $("#surname_note").html('<strong>ERROR</strong>: Your surname must be in the range
                                     of 2 to 20 characters long.'); 
                                }
                            else { 
                                    $("#name_alert").fadeOut("fast");
                                    $("#note").html('<strong>PERFECT</strong>: You may proceed. Good times.');  
                                    }  
                              }  
                        });
            });
        });

サーバー側のコードは、フォームのフィールドが空かどうかをチェックし、名や姓などの対応するメッセージをエコーし​​ます。その後、jquery はサーバーの出力に応じて適切なメッセージを表示します。

4

2 に答える 2

0

現在、次のケースのエラー チェックがあります。

  1. 返されたデータが「true」の場合。
  2. 返されたデータが「name」の場合。
  3. 返されたデータが「姓」であり、データが完全であることを示すelseステートメントがある場合。

これらの問題は次のとおりです。姓と名の両方が返されるかどうかのチェックがありません。次に、if (data == 'surname') に、データが完全かどうかを返すelse文を付けます。これは、姓に問題がなければ、完全であると返すことを意味します。

if (data == 'true') {
    $("#form").effect("shake", {times:2}, 600); 
    $("#alert").fadeIn("slow");
    $("#note").fadeIn("slow").html('<strong>ERROR</strong>: Your details were incorrect.');  
} else if (data == 'name') {
    $("#name_alert").fadeIn("fast").effect("shake", {times:1}, 600);
    $("#name_note").html('<strong>ERROR</strong>: Your first name must be in the range of 2 to 20 characters long.'); 
} else if (data == 'surname') {
    $("#surname_alert").fadeIn("fast").effect("shake", {times:1}, 600);
    $("#surname_note").html('<strong>ERROR</strong>: Your surname must be in the range of 2 to 20 characters long.'); 
} else if (data == 'namesurname') {
    $("#name_alert").fadeIn("fast").effect("shake", {times:1}, 600);
    $("#name_note").html('<strong>ERROR</strong>: Your first name must be in the range of 2 to 20 characters long.');
    $("#surname_alert").fadeIn("fast").effect("shake", {times:1}, 600);
    $("#surname_note").html('<strong>ERROR</strong>: Your surname must be in the range of 2 to 20 characters long.');
} else { 
    $("#name_alert").fadeOut("fast");
    $("#note").html('<strong>PERFECT</strong>: You may proceed. Good times.');  
}

正確な値を確認するelse if場合は、前の if ステートメントが false の場合にのみ、次の if ステートメントを実行する which を使用するのが最善です。これは if ステートメントを介して機能し、完全に一致しない場合は次のステートメントに進みます。ご質問のコメントによると、名前と姓の両方が正しくない場合の戻り値は、4番目のifステートメントである「namesurname」です。

の目的がif (data == 'true')返されたデータがあるかどうかをテストすることである場合は、レイアウトを次のように変更する必要があります。

if (data.length < 0) {
    // If statements to check if data is 'name', 'surname' or 'namesurname'
} else {
    //Data is perfect.
}

これにより、返されたデータの長さが 0 より大きい (空の文字列ではない) かどうかがチェックされ、値と一致するかどうかがチェックされます。

別のオプションは、フォームが間違っていることがわかったときにサーバーに送信する時間を無駄にするのではなく、フォームを送信する前に確認することです。これは、.length関数 (簡単) または正規表現 (それほど多くなく、このようなものではやり過ぎ) のいずれかで実行できます。

例えば

if ($('#firstnameInputField').val().length < 2 || $('#firstnameInputField').val().length > 20) {
    // first name is invalid since length is less than 2 or greater than 20
}

これは、実際にデータをチェックしたいときはいつでも呼び出すことができるイベントまたは関数に入れることができます。

于 2013-04-16T12:33:10.460 に答える