7

フォームのさまざまな部分を個別に検証しようとしています。残念ながら、このフォームは CMS によって生成されるため、私の操作には制限があります。

validate現在のフォーム セクションをインデックスとして使用して、オブジェクトの配列を作成しようとしました。すなわち:

  //initialize validation
  validators = [
    $('#donation_amount').validate({ rules:{ amount: { required: true } } }),
    $('#personal_information').validate({ rules:{ Street: { required: true } } })
   ];

次のようにセクションを切り替えます。

  $('#btn-next').click(function() {
    //if validation is true, show next page
    if (validators[curOrder].valid()) {
      var old = $('.active');
      var oldOrder = old.attr('data-order');
      var newOrder = parseInt(oldOrder) + 1;
      old.removeClass('active');
      $("[data-order='" + newOrder + "']").addClass('active');
      curOrder = newOrder;
    }else{
      console.log("invalid");
   }
});

ただし、検証は常に を返しtrueます。

問題のページは次のとおりです: https://salsa3.salsalabs.com/o/50388/p/salsa/donation/common/public/?donate_page_KEY=8461

4

1 に答える 1

1

小さな JavaScript を自分で書いているのに、なぜ .validate プラグインを使用しているのでしょうか。クリックすると、入力の値 ($('#myInput').val().trim() == "") を確認し、各入力に対してそれぞれのエラー div を表示/非表示にします。

さらに、マルチパート検証では、必須フィールドのみを検証し、想定どおりに続行します。

$('#btn-next').click(function() {
var amountValid = $('#donation_amount').val().trim() == '' ? false : true;
var infoValid = $('#personal_information').val().trim() == '' ? false : true;

if (amountValid && infoValid) {
  var old = $('.active');
  var oldOrder = old.attr('data-order');
  var newOrder = parseInt(oldOrder) + 1;
  old.removeClass('active');
  $("[data-order='" + newOrder + "']").addClass('active');
      curOrder = newOrder;
    }else{
      console.log("invalid");
    }
});
于 2012-10-23T09:19:10.430 に答える