2013-10-26 58 views
0

我有一個表格,如果用戶選擇值1表示提交表格,但如果他們選擇2或3他們必須從類別reason select(那裏選擇一個值是三個選擇與類reason select,我剛所示的一個這樣的問題,以保持代碼越短POSS)確認選擇阿賈克斯呼叫值的問題

,其被包裹在一個div的HTML稱爲audit_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調用是確定的,因爲它的工作,直到我試圖添加驗證的選擇值

+0

對於我來說缺少太多的HTML以進一步調查...... – gkalpak

+0

需要哪些html位?整個批次約爲600行 – tatty27

+0

在發佈的JS中引用的部分(例如'.form_id'等)。一個** [SSCCE](http://sscce.org)**或一個** [JS小提琴](http://jsfiddle.net)**也將有所幫助... – gkalpak

回答

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(); 
+0

該表是許多創建使用while循環,form_id用於識別顯示ajax結果的正確div,我將爲我的問題添加更多信息。恐怕你現在建議的改正總是要求選擇一個理由,但別無其他,但是無論如何感謝 – tatty27

+0

@ tatty27,我錯誤地讓'parent'而不是'parents',產生了很大的差異 –

+0

是的,其他所有的東西都應該工作......當然......除了這樣一個事實,即如果用戶在第一次選擇時選擇「1」並且大約十多個錯誤和錯別字......,則表單將永遠不會被提交... :) – gkalpak