2011-02-24 4 views
2

나는 라디오 버튼 (동적으로 생성 된)과 드롭 다운 목록이있는 양식을 만들려고합니다.관련 라디오 버튼 및 드롭 다운 목록

드롭 다운 목록에는 숫자가 있습니다. 드롭 다운 목록에서 현재 눌러져있는 라디오 버튼에 따라 달라지기를 원합니다. 즉, 첫 번째 버튼을 누르면 드롭 다운 목록에 나타나는 최대 숫자가 x 값이되고, 다른 라디오를 누르면 값이됩니다. 와이. 이 값은 PHP 변수를 나타냅니다.

이 작업을 수행하는 가장 쉬운 방법은 무엇입니까?

감사합니다.

편집 :

내가 시도는 :

<html> 
<head> 
<style> 
    #ca { 
     display: none; 
    } 
</style> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script> 
<script> 
$(document).ready(function() { 
    $("input:radio").click(function() { 
     $('.searchSelect').hide(); 
     $('#' + $(this).attr("value")).show(); 
    }); 
}); 
</script> 
</head> 
<body> 
    <ul id="countrylist"> 
     <li> 
      <label for="US-country"> 
       <input name="store" id="US-country" type="radio" value="com" checked="checked" /> 
       USA</label> 
     </li> 
     <li> 
      <label for="CA-country"> 
       <input name="store" id="CA-country" type="radio" value="ca"/> 
       Canada</label> 
     </li> 
    </ul> 
    <select name="search-alias-us" id="com" class="searchSelect" title="Search in"> 
     <option value="aps" selected="selected">All Departments</option> 
     <option value="apparel">Apparel &amp; Accessories</option> 
     <option value="automotive">Automotive</option> 
    </select> 
    <select name="search-alias-ca" id="ca" class="searchSelect" title="Search in"> 
     <option value="aps" selected="selected">All Departments</option> 
     <option value="stripbooks">Books</option> 
     <option value="popular">Music</option> 
    </select> 
</body> 
</html> 

도 포함 : JQuery와 1.5 라이브러리를. 여전히 드롭 다운 목록은 라디오 버튼 클릭에서 변경되지 않습니다.

감사합니다.

+0

@ 이안 모스 질문과 관련이 있습니까? – Stofke

+1

@ 이안 모스 : 그게 무슨 소리 야? 이것은 힌디어 Q & A 사이트가 아닙니다. – BoltClock

답변

1

은 내가 질문 권리를 이해하고 있는지 확실하지 않습니다하지만 난 한 번 I 출력 모든 dropdownlists이었다 무슨 짓을했는지 비슷한, 제작 및 라디오 버튼을 클릭에 다음 CSS로 숨겨 나는 JQuery와

를 사용하여 필요한 드롭 다운리스트를 STRING_2을 (를) 숨김 해제 http://jsfiddle.net/6svcD/

그것은 쇼()와 숨기기()

$(function() { 
    $("input:radio").click(function() { 
     $('.searchSelect').hide(); 
     $('#' + $(this).attr("value")).show(); 
    }); 
}); 

여기에 전체 아래 페이지 또는 심지어 짧아 질 수 있습니다 http://jsfiddle.net/MrAGF/1/

<html> 
<head> 
<style> 
    #ca { 
     display: none; 
    } 
</style> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script> 
<script> 
$(document).ready(function() { 
    $("input:radio").click(function() { 
     $('.searchSelect').hide(); 
     $('#' + $(this).attr("value")).show(); 
    }); 
}); 
</script> 
</head> 
<body> 
    <ul id="countrylist"> 
     <li> 
      <label for="US-country"> 
       <input name="store" id="US-country" type="radio" value="com" checked="checked" /> 
       USA</label> 
     </li> 
     <li> 
      <label for="CA-country"> 
       <input name="store" id="CA-country" type="radio" value="ca"/> 
       Canada</label> 
     </li> 
    </ul> 
    <select name="search-alias-us" id="com" class="searchSelect" title="Search in"> 
     <option value="aps" selected="selected">All Departments</option> 
     <option value="apparel">Apparel &amp; Accessories</option> 
     <option value="automotive">Automotive</option> 
    </select> 
    <select name="search-alias-ca" id="ca" class="searchSelect" title="Search in"> 
     <option value="aps" selected="selected">All Departments</option> 
     <option value="stripbooks">Books</option> 
     <option value="popular">Music</option> 
    </select> 
</body> 
</html> 
+0

소리가 멋지다. 나는 그것을보고 나서 다시 먹는다. :) – dana

+0

안녕하세요, 스크립트가 jsfiddle에서 멋지게 보이고 필요한 부분을 수행합니다. 내 프로젝트에서 사용하려고했지만 거기서 작동하지 않습니다 ... 드롭 다운 목록에서 변경하지 않습니다. 템플릿에 javascript 스크립트가 포함되어 있지만 ... 어딘가에 일부 라이브러리를 포함해야합니까? 나는 실종 됐어? 라디오 버튼에 작은 스크립트를로드 할 수 있습니까? 덕분에 많이 – dana

+0

그것은 Jquery를 사용하므로 추가해야합니다. jsfiddle에는 기본적으로 포함되어 있습니다. – Stofke