2017-03-17 85 views
0

我有一個會議註冊,用戶可以選擇在兩天內註冊研討會。他們不能在第二天選擇同一個車間。然而,每個研討會都有40名參與者的軟限制,所以當註冊加載時,有一個查詢要獲得哪些研討會有剩餘席位。下面禁用基於另一選擇以及db數據的選擇選項

代碼:

<select name="workshop1" required="required" id="workshop1"> 
    <option disabled selected value=""> -- select an option -- </option> 
    <option value=」wkshp1」>Workshop name</option> 
    <option value=」wkshp2」>Workshop name</option> 
    <option value=」wkshp3」>Workshop name</option> 
    <option value=」wkshp4」>Workshop name</option> 
    <option value=」wkshp5」>Workshop name</option> 
    <option value=」wkshp6」>Workshop name</option> 
</select> 
<select name="workshop1" required="required" id="workshop2"> 
    <option disabled selected value=""> -- select an option -- </option> 
    <option value=」wkshp1」>Workshop name</option> 
    <option value=」wkshp2」>Workshop name</option> 
    <option value=」wkshp3」>Workshop name</option> 
    <option value=」wkshp4」>Workshop name</option> 
    <option value=」wkshp5」>Workshop name</option> 
    <option value=」wkshp6」>Workshop name</option> 
</select> 

我使用的是從堆棧溢出此代碼完美。

$(document).ready(function() { 
    $("#workshop1").change(function() { 
     $("select[name=workshop2] option").removeAttr("disabled"); 
     var workshopName = $("select[name=workshop1]").val(); 
     $("select[name=workshop2] option[value=" + workshopName + "]").attr("disabled", "disabled"); 
    }); 
}); 

然而,儘管我可以在頁面加載車間,充滿禁用,jQuery代碼上面會重新啓用已禁用我的選項(車間滿)在車間2。如何遍歷所有選項並排除已啓用的全部選項。第1天的講習班相同。&第2天。

+0

'$(「select [name = workshop2] option」)。removeAttr(「disabled」);'重新啓用所有選項。你爲什麼需要這個代碼行? – sandrooco

+0

造成這種情況的原因是,如果我爲第1天選擇了workshop2,那麼第2天的研討會1將被禁用。但是在完成註冊之前,我改變了主意並選擇了workshop3。無論如何,我想我已經有了解決方案。現在進行測試。 –

回答

0

好吧設法通過以下操作來解決這個問題。 由於完整的研討會輸出了空白值,即。 ,腳本可以檢查這個。如果用戶在第一天選擇了workshop1,那麼第二天的workshop2可以將第一天修改爲workshop1,我在第二個工作室中添加了一張支票。

$(document).ready(function(){ 
     $("#workshop1").change(function(){ 
      $("#workshop2 option").each(function(){ 
       if ($(this)["0"].value) { 
        $(this).removeAttr("disabled"); 
       } 
      });    
      $("select[name=workshop2] option[value=" + $("select[name=workshop1]").val() + "]").attr("disabled", "disabled"); 
     }); 
     $("#workshop2").change(function(){ 
      $("#workshop1 option").each(function(){ 
       if ($(this)["0"].value) { 
        $(this).removeAttr("disabled"); 
       } 
      });  
      $("select[name=workshop1] option[value=" + $("select[name=workshop2]").val() + "]").attr("disabled", "disabled"); 
     }); 
    }); 
相關問題