驗證輸入和下拉菜單

Question

需要一些幫助來驗證輸入和下拉菜單。 兩者都可以是空的或者兩者都必須填充。 如果用戶忘記填寫第5列中的文本輸入並從第6列中的下拉列表中選擇一個值，則警告消息應該出現 ，或者如果用戶忘記從第6列中的下拉列表中進行選擇並填寫第5列中的文本框警告消息也必須出現。 驗證必須在每個創建的行上進行。

檢查jsfiddle here。
我想是這樣的：

$('input[name=QtePack]').each(function (obj) { 
     var $QtePack = $(this).val(); 
     var tr = obj.closest('tr'); 
     var $PackType = tr.find("[id^='Pack_Type_']").val(); 
     if ($QtePack.length > 0 && $PackType == '') { 
      valid = false; 
      $PackType.addClass('error'); 
     } 
    }); 

感謝:-)

Answer 1

更新您的代碼如下：

$('input[name=QtePack]').each(function (obj) { 


    var $QtePack = $(this).val(); 
    alert("QtePack = "+$QtePack); 
    var tr = $(this).closest('tr'); 

    var reqelement=tr.find("[id^='Pack_Type_']"); 
    var $PackType = tr.find("[id^='Pack_Type_']").val(); 

    alert("PackType = "+$PackType); 
    if ($QtePack.length > 0 && $PackType == '') { 
     valid = false; 
     $(reqelement).addClass('error'); 
    } 

    if($QtePack.length == "" && $PackType != '') 
    { 
     valid = false; 
     $(reqelement).removeClass('error'); 
     $(this).addClass('error'); 
    } 
    if($QtePack.length == "" && $PackType == '') 
    { 
     valid = true; 
     $(this).removeClass('error'); 
     $(reqelement).removeClass('error'); 
    } 
}); 

Answer 2

看到這個演示http://jsfiddle.net/BE5Lr/4093/

$('#SendButton').click(function (e) { 
     // Validate if empty 
     var valid = true; 
     $('.required').each(function() { 
      var $this = $(this); 
      if ($.trim($(this).val()) == '') { 
       valid = false; 
       $(this).addClass('error'); 
      } else { 
       $(this).removeClass('error'); 
      } 
     }); 

// changes starts 

     $("input[name='QtePack']").each(function(){ 
      var ip = $(this); 
      var sel =  $(this).closest("tr").find("select[name='PackType']"); 


      if((ip.val().length==0 && sel.val().length!=0) || (ip.val().length!=0 && sel.val().length==0)) 
      { 
        alert('enter both type and quant or leave both blank'); 
        ip.addClass('error'); 
       sel.addClass('error'); 
      } 
     }); 

    // changes ends 
     // Show validation alert 
     if (valid == false) { 
      e.preventDefault(); 
      alert('Some field(s) is required.'); 

      return false; 
     } 

    });