0

したがって、jQuery ajaxを介して送信されるこのフォームがありますが、フィールドを検証したいと思います。通常の入力フィールドを検証する方法は知っていますが、ラジオボタンとチェックボックスが問題を引き起こしています。フォームを検証して送信し、結果を表示する私のコードは次のとおりです。

$(function() {
    $("#submit").click(function() {
var kysymys1 = $.trim($("input.kysymys1").val());
      if (kysymys1 == "") {
          alert('Täytä kaikki kentät.');
          return false;
      }
var kysymys2 = $.trim($("input.kysymys2").val());
      if (kysymys2 == "") {
          alert('Täytä kaikki kentät.');
          return false;
      }
var kysymys3 = $.trim($("input.kysymys3").val());
      if (kysymys3 == "") {
          alert('Täytä kaikki kentät.');
          return false;
      }

      var dataString = $('#service-test').serialize();
      //alert (dataString);return false;
     $.ajax({
    type: "POST",
    url: "../quiz.php",
    data: dataString,
    dataType: "text",
    error: function(){ alert ('Nyt jotakin meni kyllä pahemman kerran pieleen. Yritä uudelleen?');
 },
    success: function(data) {
 $("#result").html(data);
$('#service-test').fadeOut('slow');
   }


  });
  return false;

    });
  });

そしてフォーム自体：

<div style="border:1px solid grey;">
<div id="result" style="padding:2%;"></div>
<form id="service-test" action="#" method="../quiz.php" style="padding:2%;">
Muuttuuko sivujen sisältö usein?
<input type="radio" name="muuttuminen" value="Kylla" class="kysymys1" /> Kyllä
<input type="radio" name="muuttuminen" value="Ei" class="kysymys1" />Ei
Mitä näistä voisit haluta sivuillesi?
<input type="checkbox" name="possiblecontent" value="Kuvagallerian"  class="kysymys2" />Kuvagallerian
<input type="checkbox" name="possiblecontent" value="Pieni verkkokauppa"  class="kysymys2" />Pieni verkkokauppa
<input type="checkbox" name="possiblecontent" value="Isompi verkkokauppa"  class="kysymys2" />Isompi verkkokauppa
<input type="checkbox" name="possiblecontent" value="Jotain muuta"  class="kysymys2" />Jotain muuta
Millaisen ulkoasun haluaisit?
<input type="radio" name="ulkoasu" value="Massasta erottuvan, uniikin ulkoasun"  class="kysymys4" /> Massasta erottuvan, uniikin ulkoasun
<input type="radio" name="ulkoasu" value="Jotain muuta"  class="kysymys3" /> Jotain muuta
<input id="submit" type="submit" /></form>
</div>

ただし、ユーザーが選択しない場合、検証部分は何もしません。

これもjsfiddeです：http： //jsfiddle.net/ducVP/4/

4

2 に答える 2

1

ラジオボタンの検証をから変更

var kysymys1 = $.trim($("input.kysymys1").val());
          if (kysymys1 == "") {
              alert('Täytä kaikki kentät.');
              return false;
          }

に

if (!$(".kysymys1").is(':checked')) {
          alert('Täytä kaikki kentät.');
          return false;
      }

http://jsfiddle.net/ducVP/13/

于 2012-08-04T11:21:46.877 に答える
1

値を確認する代わりに、チェックボックス/ラジオ ボタンが選択されているかどうかを確認します。

だからこれを試してください

if ($('input.kysymys1:checked').val() == 'false') {
          alert('Täytä kaikki kentät.');
          return false;
}

これは、チェックボックスがチェックされているかどうかをチェックし、チェックされていない場合はアラートを実行します。

編集 ラジオ ボタンの 1 つだけをデフォルトとしてオンにしないのはなぜですか?

于 2012-08-04T11:18:14.600 に答える