1

jQuery 検証プラグインで検証している長い形式があります。フォームが検証された後、送信ボタンを確認ボタンに変更し、フォームのエラーをチェックすることについて上記の適切なメッセージを表示します。このボタンをもう一度クリックすると、すべての必須フィールドがまだ入力されている限り、今度は実際にフォームを送信する必要があります。私は次のものを持っています:

var confirmed = function(){
  alert($("#someForm").attr("name")); //just to see the function fire...
  $("#someForm").submit();  
  return true;
}

$(document).ready(function(){
  $("#someForm").validate({
    submitHandler: function(form){
      var oldBtn = $("#submit");
      var newBtn = oldBtn.clone();
      newBtn.click(confirmed)
      newBtn.text("Confirm");
      newBtn.insertBefore(oldBtn);
      oldBtn.remove();
      newBtn.attr({"id": "submit"});
    }
  });
});

...

<button type="submit" id="submit">Submit</button>

フォームを検証するために機能し、ボタンがテキストを変更し、クリックすると関数が起動します（アラートにはフォームの名前が含まれています）が、フォームが実際に送信されることはありません。どんな助けやアイデアも大歓迎です。

ありがとう

編集：わかりました、私はそれを理解したと思います。送信ボタンを非表示にし、Validate というボタンを使用して送信せずにフォームが検証$("#someForm").valid();されているかどうかを確認しますなど。以下を参照してください。

$(document).ready(function(){
  $("#submitBtn").hide();
  $("#confMessage").hide();
  $("#someForm").validate();
});

var checkValid = function(){
  var isValid = $("#volunteer").valid();
  if(isValid){
    $("#validBtn").remove();
    $("#submitBtn").show();
    $("#confMessage").show();
  }
}

...

<p id="confMessage">Please review your submission.</p>    
<p><button id="validBtn" onclick="checkValid()">Validate</button>    
<button type="submit" id="submitBtn">Submit</button></p>

完璧に動作し、元のコードよりもずっときれいです!

4

2 に答える 2

0

削除 oldBtn.remove();すると動作します。

于 2013-03-13T03:39:15.583 に答える
0

あなたが持っている

  var oldBtn = $("#submit");
  var newBtn = oldBtn.clone();

上記の行で行っていることは、同じことDOMを html に追加しているため、意味IDもコピーされます。
また、ID は ごとに一意である必要がありますDOM。
cloned の ID を書き換えて試してDOMみます。

と

newBtn.click(confirmed)

newBtnこのコードは、イベントを呼び出していないイベントに割り当てていることを意味しますclick。

clickイベントの呼び出しに使用.trigger()

于 2013-03-13T03:54:25.803 に答える