用cshtml和javascript動態地改變dropdownlist

我試圖做一些有點超出我的駕駛室，我希望主要是在概念上指向正確的方向（當然，代碼永遠不會傷害）。用cshtml和javascript動態地改變dropdownlist

在一個cshtml頁面中，我有n下拉列表的數量，每個下拉列表的值分別爲1,2,3 ... n。我不希望任何下拉菜單在頁面上包含與另一個下拉菜單相同的值。我正在尋找一種方法來動態地用Javascript做到這一點。

有沒有什麼聰明的方法可以做到這一點？我可以想到一個非常醜陋的算法，包括每次下拉列表更改值時運行每個下拉列表，查找具有相同值的任何下拉列表並添加1（如果我們將其滾動到1在n）。然後不得不再次通過，以改變下一個我們碰到的列表，其值與先前相同。最後，我們會在每個列表（運行時O（n^2））之後停止n次。即使沒有這樣做的巧妙方式，我也無法想象這是接近最佳解決方案的地方。

任何意見都將不勝感激。謝謝。

來源

2014-08-29 user535617

每次都在JavaScript中值的數組，和下拉列表的變化，這樣做：

檢查值數組中已經存在，阻止行動，如果它。
將新選擇存儲在數組中。

可能會有更多的東西（例如，你可能還需要值的源下拉列表ID存儲在陣列中，也讓你知道它的價值，你需要的，如果在下拉列表改變一次，以除去）但是這個總體思路應該簡單而有效。

來源

2014-08-29 21:27:15 Colin

如果我理解正確，它可能比看起來更容易。

我知道你有n個（比方說3個）下拉列表，分別在1,2,3中選擇。但是，如果您在第一個選項中選擇3，則您想要防止具有第三個下拉菜單的重複3。但是，您可以嘗試按值查找此重複項，並將其值設置爲您正在更改的下拉列表的舊值。

E.g.使用jQuery：http://www.w3schools.com/jquery/sel_attribute_equal_value.asp

$("[value=3]").attr("value", 1)

這應該保持狀態，有沒有重複，否則，你可能需要做取決於發現，像設置爲未選中的元素個數智能的東西。

來源

2014-08-29 21:27:54 Pieter21

你順便還需要有關變更前獲得下拉列表的價值的建議。 – Pieter21 2014-08-29 21:47:46

使用jquery，添加一個處理程序來獲取舊值和新值。然後，您可以在所有其他選擇中啓用舊值，並禁用新值。這需要一些腳本的魔力，但這篇文章將幫助： getting value of select dropdown before change

<html> 
<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
    <script type="text/javascript"> 

    $(document).ready(function(){ 

     var valueToEnable; 
     var defaultValue = '0'; 

     $('.theDropdowns').on('focus', function() { 
      valueToEnable = this.value; 
     }).blur(function() { 
      $('.theDropdowns option[value=' + valueToEnable + ']').removeAttr('disabled'); 
      var valueToDisable = this.value; 
      if (valueToDisable != defaultValue) { 
       $('option[value=' + valueToDisable + ']', $('.theDropdowns').not(this)).attr('disabled', 'disabled'); 
      } 
     }); 
    });   
    </script> 
</head> 
<body> 
    <select class="theDropdowns"> 
     <option value="0">Select a value</option> 
     <option value="1">One</option> 
     <option value="2">Two</option> 
     <option value="3">Three</option> 
    </select> 
    <select class="theDropdowns"> 
     <option value="0">Select a value</option> 
     <option value="1">One</option> 
     <option value="2">Two</option> 
     <option value="3">Three</option> 
    </select> 
    <select class="theDropdowns"> 
     <option value="0">Select a value</option> 
     <option value="1">One</option> 
     <option value="2">Two</option> 
     <option value="3">Three</option> 
    </select> 
</body>

來源

2014-08-29 21:35:56

用cshtml和javascript動態地改變dropdownlist

回答

相關問題