드롭 다운 변경 화재 쇼 동일 요소

<span id="row-0" class="row"> 
    <span class="Foo"> 
     <select name="first[]"> 
      <option value="XX">XX</option> 
      <option value="YY">YY</option> 
      <option value="ZZ">ZZ</option> 
     </select> 
    </span> 
    <span class="Foo"> 
     <select name="second[]"> 
      <option value=""></option> 
      <option value="AA">AA</option> 
      <option value="BB">BB</option> 
      <option value="CC">CC</option> 
     </select> 
    </span> 
</span>

나는 두 개의 다른 선택을 가지고 행이 있습니다. 둘 다 채워지면 다른 행을 보여주고 싶습니다. jquery를 사용하여 어떻게 구현할 수 있습니까?드롭 다운 변경 화재 쇼 동일 요소

출처

2012-05-21 user12345

무엇을 시도 했습니까? 첫 번째 선택 항목에는 기본값이 없습니다. – gdoron

* "다른 행을 보여주고 싶다"* 조금 더 설명해주십시오. –

새 행을 추가하는 것이 무슨 뜻인지 확실하지 않습니다. 그러나 일반적으로 이것은 당신이 찾고있는 것입니다. 마지막 드롭 다운의 change 이벤트를 catch하고 행 사본을 만들어 부모에 추가해야합니다. 행 길이가 클래스 container 인 div 안에 있다고 가정하면, 제공된 HTML 마크 업에서 작동해야합니다. 여기

$(function(){ 
    $(".container").on("change",".Foo:last",function(){ 
     var item=$(this); 
     var rowClone=item.closest(".row").clone(); 
     item.closest(".container").append(rowClone); 
    }); 
});

샘플이다 http://jsfiddle.net/Dbq3D/12/

이 늘 제공된 가입 마크 값이 이미 가득 첫번째 드롭을 가지기 때문에 선택 모두가 작성되어 있는지 확인.

출처

2012-05-21 23:02:52 Shyju

(+1) 나는 이제 또 다른 질문을하는 것을 상상할 수 있습니다. "예, 좋아, 너는 새로운 옵션에서 이미 선택된 옵션을 제거하고 싶다.":) –

흠 .. 첫 번째 옵션을 만드는 방법에 대한

$("select").change(function(){ 
    if ($("#row-0").find(':selected').not(:contains('make your choice')).size()>1) 
    {$("#row-0").append('<br/> yournewLine');} 
});

"당신의 선택을"어떻게 ... 그것은 ... 나는 당신에게

@Roko을하는 데 도움이 나에게 자연적인 방법 희망 보인다 C. Buljan은 다음과 같이 말합니다. "이제는 또 다른 질문을 할 수 있습니다."예, 좋아요, 이제는 새 옵션에서 이미 선택된 옵션을 제거하고 싶습니다. "). 나는 다음을 사용하여 이것도 간단하게 생각할 수 있습니다 : selected - Selector like :

$("select").change(function(){ 
    /*better read the value first*/ 
    $(":selected").not(:contains('make your choice')).remove(); 
});

출처

2012-05-21 23:32:41

드롭 다운 변경 화재 쇼 동일 요소

답변

관련 문제