2013-03-10 7 views
0

나는 세 개의 드롭 다운을 채우는 데 사용되는 데이터 배열이 <select> 상자입니다. 내 질문에 어떻게 배열 자체가 아닌 배열에서 같은 값을 제거 할 수 있지만 제거 (또는) 드롭 다운 같은 값을 해제 할 수 있습니다? 예를 들어데이터 배열에서 값 제거

:

data = { 
firstbox_a: ['grpA_1','grpA_2','grpA_3','grpA_4'], 
firstbox_b: ['grpB_1','grpB_2','grpB_3','grpB_4'], 
grpA_1: ['y','n','un','st'], 
grpA_2: ['y','n','un','st'], 
grpA_3: ['y','n','un','st'], 
grpA_4: ['y','n','un','st'], 
grpB_1: ['a','b','avg','unc'], 
grpB_2: ['a','b','avg','unc'], 
grpB_3: ['a','b','avg','unc'], 
grpB_4: ['a','b','avg','unc'] 
} 

grpA_1grpA_4에 동일한 값을 갖는다. grpA_1에 'y'를 선택하면 grpA_2에서 grpA_4으로 값을 비활성화하거나 제거하여 'y'를 선택할 수 없습니다. 떠오르는

+0

나는 이것이 자바라고 가정합니다. – christopher

답변

0

하나의 해결책이 될 수 :

드롭 다운 목록에서 항목의 선택에 이벤트를 연결합니다.

IF에있는 함수를 추가하십시오.
다른 모든 드롭 다운 목록이 동일한 값으로 선택되었습니다.
기본값을 사용하지 않습니다.

$('.target').change(function() { 
    // Your code goes in here :) 
}); 
+0

도움을 주신 chris에게 감사드립니다. 실제로 jquery (i)를 사용해야했습니다 (i가 지정해야 함). 이 구현에서 볼 수있는 유일한 문제는 각 드롭 다운이 이전 드롭 다운의 선택을 기반으로하는 값 배열로 활성화 (채우기)된다는 것입니다. – user1648449

+0

JQuery에서 이것은 실제로 매우 쉽습니다. 내가 너에게 대답 해줄거야. – christopher

0

내가 이전의 답변에 따라, 귀하의 질문을 이해 한 확실하지. 귀하의 데이터를 사용하려고했지만 목록이 어떻게 채워지는지 확신 할 수 없었습니다.

이 코드는 두 가지 목록을 생성합니다. 두 번째 목록에서 옵션을 선택하면 첫 번째 목록 의 색인이 동일한 색인의 항목도 비활성화됩니다.

<!DOCTYPE html> 
<html> 
<head> 
<script> 
function byId(e){return document.getElementById(e);} 
function newEl(tag){return document.createElement(tag);} 
function newTxt(txt){return document.createTextNode(txt);} 
function toggleClass(element, newStr) 
{ 
    index=element.className.indexOf(newStr); 
    if (index == -1) 
     element.className += ' '+newStr; 
    else 
    { 
     if (index != 0) 
      newStr = ' '+newStr; 
     element.className = element.className.replace(newStr, ''); 
    } 
} 
function forEachNode(nodeList, func) 
{ 
    var i, n = nodeList.length; 
    for (i=0; i<n; i++) 
    { 
     func(nodeList[i], i, nodeList); 
    } 
} 

window.addEventListener('load', mInit, false); 


function onList2Changed(list2_Element, list1_Element) 
{ 
    var i; 

    for (i=0; i<list1_Element.options.length; i++) 
    { 
     if (i == list2_Element.selectedIndex) 
      list1_Element.options[i].setAttribute('disabled', 'true'); 
     else 
      list1_Element.options[i].removeAttribute('disabled'); 
    } 
} 

function mInit() 
{ 
    var opt, mSel1, mSel2; 
    var i, numOpts = 10; 

    mSel1 = newEl('select'); 
    for (i=0; i<numOpts; i++) 
    { 
     opt = newEl('option'); 
     opt.appendChild(newTxt("boxA: " + (i+1))); 
     mSel1.appendChild(opt); 
    } 
    mSel1.setAttribute('size', i); 
    document.body.appendChild(mSel1); 

    mSel2 = newEl('select'); 
    for (i=0; i<numOpts; i++) 
    { 
     opt = newEl('option'); 
     opt.appendChild(newTxt("disable BoxA option: " + (i+1))); 
     mSel2.appendChild(opt); 
    } 
    mSel2.addEventListener('change', myFunc); 

    function myFunc() 
    { 
     onList2Changed(mSel2, mSel1); 
    } 
    document.body.appendChild(mSel2); 
} 

</script> 
<style> 
</style> 
</head> 
<body> 
</body> 
</html> 
+0

도움을 주셔서 감사합니다. 그것의 실제로 3 개의 명부. firstbox_a 및 _b는 하나의 드롭 다운입니다. grpA 1-4 및 grpB 1-4는 두 번째 드롭 다운입니다. 값 (y, n, 평균 ... 등)은 세 번째 드롭 다운입니다. 세 번째 드롭 다운에는 해당 값이 비활성화/제거됩니다. 따라서 '평균'을 한 번 선택하면 '평균'을 다시 선택할 수 없습니다. – user1648449

+0

걱정할 필요가 없습니다. 나는 4 ~ 5 번 정도 위의 당신의 의견을 읽었지만, 정말로 머리가 나 꼬리를 만들 수 없다는 것을 유감스럽게 생각합니다. * object는 각 목록이 보유하는 데이터에 해당합니다. 세 가지 목록을 채우는 코드를 포함하도록 질문을 편집하면보다 유용한 답을 제공 할 것입니다. :) – enhzflep

+0

@PSCoder - 유치하고 예측할 수있는 +1. 나는 25 분 전에 이것을 다운 받았다는 것을 깨달았습니다. 당신은 계속 포인트 매춘을 계속합니다. 지금까지 분명히 잘 작동하고 있습니다! – enhzflep