1

次のjqueryコードを使用して、値を受け取り、完全に機能する値を検証しています。次に、それらをJavaアプリケーションに送信して応答を受信しますが、指定されたメソッドに要求を送信しません。

 <script type="text/javascript">
            $(document).ready(function(){
                $('#reg').click(function(){
                    $('#signup').show('fast');
                });
                $('#register').click(function(){
                    var name = $("#name").val();
                    var family = $("#family").val();
                    if(name.length <= 1)
                    {
                        $("#messageSent").text("name is invalid");
                    }
                    else if(family.length <= 1){
                            $("#messageSent").text("family is invalid");
                    }else{
                        var data = 'name=' + name & 'family='+ family;
                          $.ajax({
                              type:"GET",
                              cache:false,
                              url:"http://localhost:8080/myApp/register.jsp",
                              data : data,
                              success:function(html){
                                  $("#messageSent").html(html);
                              }
                          });
                          return false;
                         }

                    });
                });
4

4 に答える 4

1

わかりました、ここであなたがする必要があることです

1)フォームの値を検証関数に渡すにはどうすればよいですか?

回答: 検証関数がフォーム要素の値を取得できる値を渡す必要はありません。これを行う方法は次のとおりです。

var name=$("name").val();
var family=$("family").val();

すべての値を取得したら、それを検証したいことをすべて行うことができます。

2)エラーまたは確認を表示するにはどうすればよいですか? (そのため、送信後にフォームを非表示にしないでください)。

回答: div を作成し、その css プロパティ display:hidden を設定できます。検証関数がフォームを検証しない場合は、この div を表示して、その中にエラーを表示できます。

<div id="merror" style="display:none"></div>

次に、検証関数で

$("merror").show();
$("merror").html("The form validation failed, please try again");

3)私の方法に代わるものはありますか?

回答: すでに jquery を使用している場合は、通常の javascript ajax メソッドではなく、jquery $.post を使用してデータをポストします。jquery メソッドを使用する利点は、ブラウザー間の互換性があり、使いやすいことです。

もう一つ。サーバーから応答を受信したら、確認を表示する必要があります。

于 2013-03-17T06:49:47.867 に答える
1

フォームの検証には jquery validate を使用できます。

詳細については、次のリンクを参照してください: http://docs.jquery.com/Plugins/Validation

更新された回答を見つけてください。それが役に立てば幸い。

<script type="text/javascript">
$(document).ready(function () {
    $('#registrationform').hide();
    $('#registrationBtn').click(function () {
        $('#registrationform').show();
    });
});

function saveForm() {
    $("#registrationform").validate({
        rules: {
            //add rules for validation here
            name : "required"
        },
        submitHandler: function() {
            //ajax code to execute if form is successfully validated
            var request = $("#registrationform").serialize();
            $.ajax({
                type: "POST",
                url: url,
                data: request,
                dataType:"json",
                async:false,
                success: function(response){    
                    $('#registrationform').hide();                                                           
                },
                error: function(XMLHttpRequest,textStatus){                     
                }
            });            
        },
        messages : {
            //error messages to display
            name : "Please enter the name"
        }
    });
}
</script>
<input type="button" id="registrationBtn" name="registrationBtn" value="Register"/>
<form id="registrationform">
    <input type="text" id="name" name="name" /><br/>
    <input type="submit" id="submitBtn" name="submitBtn" onclick="saveForm();"/>
</form>
于 2013-03-17T07:04:13.083 に答える
1

別のjspファイルを作成し、その結果を入れます。次に、最初のページからコントローラーを呼び出し、プライマリページのdivに新しいjspファイルを提供します。

$.ajax({
    type: "GET",
    url: "nameOfAction",
    data:"name=" + name + "family=" + email,
    dataType: "text/html;charset=utf-8",
    success: function(msg) {
        $("#nameOfDive").html(msg);
    }
});
于 2013-03-20T04:03:03.087 に答える
1

なぜ AJAX jQuery を使わないのですか? 「$.ajax({});」

お役に立てば幸いです。

$(document).ready(function() {
   $('#register').submit(function() {
      var name = $('#name').val();
      var family = $('#family').val();
      if($.trim(name) == '' || $.trim(family) == '') {
         alert('You can not leave fields blank. Sorry.');
      } else {
         $.ajax({
            type: 'POST',
            url: 'form.php',
            beforeSend: function() {
               // function while sending...
            },
            success: function(data) {
               // function if success. "data" returns the response
            },
            error: function() {
               // Create function for errors in the page request.
            }
         });
      }
   });
});
于 2013-03-17T07:10:05.433 に答える