0

ユーザーが1の値を選択するとフォームが送信されますが、2または3を選択すると、クラスで選択から値を選択する必要があるフォームがありますreason select(クラスで3つの選択があり、reason select1つを示しましたコードを可能な限り短く保つためのこの質問)

と呼ばれるdivにラップされたhtmlaudit_content

 <tr>
    <td>
        <select name="grade" class="grade" >
            <option value="1">1 - Perfect</option>
            <option value="2">2 - Diagnostic</option>
            <option value="3">3 - Unusable</option>
        </select>
    </td>
</tr>
<tr>
    <td>
        <select name="exposure_reason" class="reason_select" >
            <option value="1">Reason One</option>
            <option value="2">Reason Two</option>
            <option value="3">Reason Three</option>
        </select>
    </td>
</tr>
<tr>
    <td>
    <input type="button" class="delete_submit delete_from_audit" value=""
        onClick="delete_image('<? echo $image_id; ?>','<? echo $audit_id; ?>')" />
    <input type="button" class="reset_grade control_submit ie7_reset"     
        onclick="reset_image('<? echo $image_id; ?>','<? echo $audit_id; ?>')" value="" >
    <input type="hidden" class="form_id" value="<? echo $i; ?>" >
    <input type="button" name="audit_submit"
        class="audit_submit audit_submit_btn ie7_submit" value="" />
    </td>
</tr>

jquery

  $(document).ready(function(){
    $('#audit_content').on("click", ".audit_submit", function(){
      var form_id = $(this).prev('.form_id').val();
      alert(form_id);
      var $form = $(this);
      reasonHasVal = false;
      if ($form.find('select[name="grade"]').val() != "1") {
       $form.find("select.reason_select").each(function() {
           if ($(this).val() != "") {
               reasonHasVal = true;
                $.ajax({
                type: "POST",
                url: "ajax/image_audit.php",
                dataType: "json",
                data: $('#audit_form'+form_id).serialize(),
                success: function(response){
                $('.audited_ok_tick'+form_id).html(response);
            },
          error:function (xhr, ajaxOptions, thrownError){
          alert(thrownError);
        }
     });
     return false;
    }
       });
       if (!reasonHasVal) {
           e.preventDefault();
           alert("Please select a reason.");
       }
     } 
  });
});

送信ボタンをクリックすると、アラートはform_id機能しますが、他には何もありません。選択値の検証を追加しようとするまで機能していたため、ajax呼び出しは問題ありません。

4

1 に答える 1

1

私はいくつかの問題を見ました：

e.preventDefault()まず、呼び出してeも定義されていないため、コンソールにエラーが表示されるはずです。したがって、イベントの匿名関数を登録するときはclick、次を追加する必要がありますe。

$('#audit_content').on("click", ".audit_submit", function (e) {

次に、$formボタンへの参照になり、$form.find('select[name="grade"]')常に空になります。form_idすべてのコードを投稿するとより明確になるかもしれませんが、各質問を個別に投稿し、 ?で識別されるようにするつもりだと思います。表示されていないどこか、おそらく共通テーブルであると推測しています。form_id値は要素の ID として使用されます。その場合、代わりに次のコードが必要になります。

var $form = $(this).parents('#' + form_id);

私の仮定が正しければ、他のすべてが正しく機能するはずです。私の仮定が正しくない場合は、入力コントロールを見つけるためのより良い方法を見つける必要があります。いくつかの代替手段は次のとおりです。

var $form = $(this).parents('table');
var $form = $(this).parent().parent().parent();
于 2013-10-26T20:19:31.227 に答える