0

ajax によって送信されたフォームに検証を追加しようとしていますが、部分的に機能しています。

フォームを送信するコードは次のとおりです。

<script type="text/javascript">
$(document).ready(function(){$(".sendName").click(function(){
var Email=$("#Email").val();
var Name=$("#Name").val();
var ErrorType=$("input:radio[name=ErrorType]:checked").val();
var Univer=$("#Univer").val();
var ErrorMessage=$("#ErrorMessage").val();
$.post("report.php",{Email:Email,Name:Name,ErrorType:ErrorType,Univer:Univer,ErrorMessage:ErrorMessage},function(data){$("#loadName").html(data).effect('bounce', { times: 5, distance: 30 }, 300);
  });
 });
});
</script>

そのコードは完全に機能します。

私は livevalidation プラグインも使用しており、ほとんどの場合同様に機能しています。私が抱えている唯一の問題は、フォームを送信する関数内から検証コードを呼び出すことです。

通常、検証コードは次のように呼び出されます。

 <form onsubmit="return validate(this)">

ただし、フォームは ajax によって送信されているため、現在のフォーム タグは次のとおりです。

 <form onSubmit="return false;">

したがって、私ができる必要があるのは、ajax を介してフォームを送信する関数内から検証関数を呼び出すことです。

どうすればこのようなことをすることができますか? どちらのスクリプトも単独で問題なく動作しています。最後に確認する必要があるのは、この 1 つだけです。

そのため、ajax 関数が呼び出されたときに検証関数を呼び出す必要があります。フォームが検証された場合、スクリプトは ajax リクエストを完了することができ、フォームが検証されない場合は送信されません。

いくつか検索したところ、同様の質問がいくつか見つかりましたが、解決策はありませんでした。どんな助けでも大歓迎です。

4

2 に答える 2

0

議案への同意

この形を想定して

<form id="formId" ...
  .
  .
  <input type="submit" />
</form>

あなたのコードを使用して：

<script type="text/javascript">
$(document).ready(function(){
  $("#formId").submit(function(){
    if (!validate(this)) return false;
    var Email=$("#Email").val();
    var Name=$("#Name").val();
    var ErrorType=$("input:radio[name=ErrorType]:checked").val();
    var Univer=$("#Univer").val();
    var ErrorMessage=$("#ErrorMessage").val();
    $.post("report.php",
      {Email:Email,Name:Name,ErrorType:ErrorType,Univer:Univer,ErrorMessage:ErrorMessage},function(data){$("#loadName").html(data).effect('bounce', { times: 5, distance: 30 }, 300);
    });
    return false; // cancel normal submission
   });
});
</script>
于 2012-05-06T05:03:17.393 に答える
0

これを行う簡単な方法は、検証エラーが発生した場合にのみ送信をキャンセルし、それ以外の場合は送信を正常に行うことです。

<form id="new-item" method="post" action="/i">

次に、JavaScriptで：

$('#new-item').submit( function () {

  var valid = true;

  // do you validation logic
  valid = validate(this);

  // returning true will let the normal submit action happen
  // returning false will prevent the default action (i.e. the form will not be sumitted)
  return valid;

});

標準の送信機能を使用したくない場合 (ただし、javascript が無効になっている場合に機能するため、これがベスト プラクティスです)、同様のことを行いますが、常に false を返します。

$('#new-item').submit( function () {

  var valid = true;

  // do you validation logic
  valid = validate(this);

  if (valid ) {
    // send your ajax post request here
  }


  // returning true will let the normal submit action happen
  // returning false will prevent the default action (i.e. the form will not be sumitted)
  return false;

});
于 2012-05-06T04:33:32.890 に答える