동적 드롭 다운

내 사이트에 두 개의 드롭 다운이 있습니다. 나는 JavaScript를 사용하여 onChange() 'fn에 의해 다른 드롭 박스에서 선택하는 값에 따라 옵션의 수와 하나의 드롭 다운 옵션의 값을 변경하려고합니다. 예 /첫번째 드롭/동적 드롭 다운

<select name="language" id="language"> 
    <option>select</option> 
    <option >English</option> 
    <option>Tamil</option> 
    <option>Telugu</option> 
    <option >Kannada</option> 
    <option>Malayalam</option> 
    <option >Urdu</option> 
    <option>Punjabi</option> 
</select>

/두번째 드롭 그 & 값이 값 이상의 드롭의// 변경에 대한 변경 기초하여야 옵션 않음/

<select name="media"> 
    <option>The Indian Express</option> 
    <option >The Hindu</option> 
    <option >CNN IBN</option> 
    <option>NDTV</option> 
</select>

나는 오랫동안 그것을 고군분투했다. 이것은 PHP를 통해 해결할 수 있다고해도 나에게 해결책을 제공해 주길 바란다.

출처

2011-08-14 praba230890

시도해보십시오.

HTML

<select name="language" id="language" onchange="SetMedia(this)"> 
    <option>select</option> 
    <option >English</option> 
    <option>Tamil</option> 
    <option>Telugu</option> 
</select> 

<select name="media" id="media" disabled="disabled"> 
    <option>select</option> 
</select>

자바 스크립트 여기

function SetMedia(objLanguage) { 
    var objMedia = document.getElementById("media"); 
    objMedia.options.length = 0; 
     objMedia.disabled = false; 
    switch (objLanguage.value) { 
    case "English": 
     objMedia.options.add(new Option("The Indian Express")); 
     objMedia.options.add(new Option("The Hindu")); 
     break; 
    case "Tamil": 
     objMedia.options.add(new Option("Tamil Paper 1")); 
     objMedia.options.add(new Option("Tamil Paper 2")); 
     break; 
    case "Telugu": 
     objMedia.options.add(new Option("Telugu Paper 1")); 
     objMedia.options.add(new Option("Telugu Paper 2")); 
     break; 
    default: 
     objMedia.options.add(new Option("select")); 
     objMedia.disabled = true; 
     break; 
    } 
}

데모 : http://jsfiddle.net/naveen/z48dc/

출처

2011-08-14 00:48:55 naveen

을 확인하지만 난 다른 자바 스크립트 FN()를 사용하려고하면 (JQuery와는)이 작동하지 않는 드롭 다운 스타일을. 또한 위의 솔루션을 주셔서 감사합니다. – praba230890

정교하게 말하십시오. 나는 당신을 얻지 못했습니다. – naveen

여기 나는 onchange에 의한 dropdowns와 dropdowns에 세련된 모습을 추가하려고 노력하고있다. 어떤 스타일도없이 드롭 다운을 사용할 때 코드가 제대로 작동하지만 문제가되지 않습니다. 두 번째 드롭 다운을 onchange 메소드로 어떻게 처리 할 수 있는지를 알 수없는 초보 인 것입니다. 시도했지만 실패했습니다. onChange를 사용하여 두 드롭 다운을 모두 작업하길 원합니다. – praba230890

당신은 당신이 약간 더러운 접근 발생합니다 고맙다고 할 수있는 것보다 그냥 일반 자바 스크립트이 작업을 수행해야하는 경우 .

http://www.felgall.com/jstip22.htm

나는 JQUERY 및 AJAX를 사용하여이 작업을 수행하는 것이 좋습니다 것입니다. 두 번째 드롭 다운 데이터를 가져 오기 위해 AJAX 요청을 보냅니다. 그것은 작동하고이 샘플

http://www.99points.info/2010/06/ajax-tutorial-dynamic-loading-of-combobox-using-jquery-and-ajax-in-php/

http://demos.99points.info/dynamic_dropdown/

출처

2011-08-14 00:49:24

동적 드롭 다운

답변

관련 문제