2013-10-16 55 views
1

我有一個窗體2 <select>,select1允許簡單的選擇,並選擇2允許多個選擇。我想要的是,當用戶在select1中選擇某些內容時,應該根據我的數據數組選擇select2中的關聯數據。Javascript和多個選擇值

function selectIt() { 
var divArray = new Array(); 
// this is the value for first element on select1 
divArray[0] = 3; 
// these are the corresponding values on select2 that should be selected 
divArray[0] = new Array(); 
divArray[0][0] = 5; 
divArray[0][1] = 1; 
divArray[0][2] = 2; 
// and so on 
divArray[1] = 2; 
divArray[1] = new Array(); 
divArray[1][0] = 6; 
divArray[1][1] = 3; 
divArray[1][2] = 2; 

    var select2 = document.getElementById("secondSelect"); 
    for (var i=0; i < select2.options.length; i++) 
     select2.options[i].selected = false; 
} 

所以,如果用戶選擇索引1,在選擇2項目2,3和6應該被選中。

首先,我取消使用之前選定的項目:

var select2 = document.getElementById("secondSelect"); 
for (var i=0; i < select2.options.length; i++) 
    select2.options[i].selected = false; 

在那之後,我不知道該怎麼辦。

some loop here 
    select2.options[i].selected = true; 

任何幫助將大大apreciated !!!!

+1

你不喜歡jQuery庫嗎?在這裏使用函數和循環會容易得多。 –

+0

我不知道如何使用jquery,我是js的新手。 – Nicoli

回答

1

您可以用這種方式聲明數組:

divArray[0] = [5, 1, 2]; 

我只是試圖通過寫它沒有考慮測試所以裸回答它可以有一些錯誤:

document.getElementById("firstSelect").onchange = function() { 
    var optionIndex = this.selectedIndex; // in this function 'this' is select element 
    var optionsToSelect = divArray[optionIndex]; 
    var select2 = document.getElementById("secondSelect"); 
    for (var i = 0; i < optionsToSelect.length; i++){ 
     select2.options[optionsToSelect[i]].selected = true; 
    } 
}; 
+0

謝謝...... D – Nicoli

+0

按照我的寫法工作 - 很多錯誤? – irla

+0

不確定,因爲我沒有按原樣使用它,請閱讀下面的內容。 – Nicoli

1

監守我需要一些數據庫數據我結合了JS裏面的一些PHP代碼:

<script type="text/javascript"> 
function selectM() { 
var divArray = new Array(); 

<? 
if ($result = $database->getDivs()){ 
    $cont = 0; 
    while ($divs = mysql_fetch_array($result)) { 
     $da = "divArray[".$divs['iddiv']."]"; 
     if ($resultEd = $database->getEdic($divs['iddiv'])){ 
      if ($cont == 0) $da .= " = ["; 
      $tot = mysql_num_rows($resultEd); 
      while ($divEd = mysql_fetch_array($resultEd)) { 
       $da .= $divEd['ed_id']." "; 
       $cont++; 
       if ($cont < $tot) $da .= ", "; 

      } 
     } 
     $da .= "]; "; 
     $cont = 0; 
     echo $da; 
    } 
} 
?> 

var largo, valor; 
var inexE   = document.getElementById("idDiv").value ; 
var ediciones  = document.getElementById("ediciones"); 
    if (inexE > 0) { 
    var toSelect = divArray[inexE]; 
    for (var i=0; i < ediciones.options.length; i++) { 
     ediciones.options[i].selected = false; 
     valor  = ediciones.options[i].value; 
     largo  = toSelect.length; 
     for(var j = 0; j < largo; j++) { 
      if(toSelect[j] == valor) 
       ediciones.options[i].selected = true; 
     } 
    } 
    } else { 
    for (var i=0; i < ediciones.options.length; i++) 
     ediciones.options[i].selected = false; 
    } 

} 
</script> 

完美的作品!

謝謝你指點我正確的方向!

+0

如果你想構建一些php對象,用你的數據填充然後使用:var divArray = <? echo json_encode($ your_object); %> - 更具可讀性和可維護性。 – irla