CODEWITHSUNDEEP
javascriptphphtml
user3326912
user3326912

Reputation: 1

How to get the value from dropdownlist in another dropdownlist?

my question is how can i get the selected answer from a drop-down list into another drop-down list? How to program group A&B? see my code below.

Example:

if some one select from group A and from group B, i want the selected answere in de drop-down list Group A&B.

<!DOCTYPE html>
<html>
<body>

<select name="GROUD A">
<option value="Select">Group A</option>
<option value="A1">A1</option>
<option value="A2">A2</option>
<option value="A3">A3</option>
<option value="A4">A4</option>
</select>
<p></P>


<select name="GROUD B">
<option value="Select">Group B</option>
<option value="B1">B1</option>
<option value="B2">B2</option>
<option value="B3">B3</option>
<option value="B4">B4</option>
</select>

<select name="GROUP A&B">
<option value="Select">Selection from Group A and B</option>
<option value="A?">A?</option>
<option value="B?">B?</option>
</select>

</body>
</html>

Upvotes: 0

Views: 77

Answers (2)

Susheel Singh
Susheel Singh

Reputation: 3854

Pure javascript solution:

check the fiddle:

http://jsfiddle.net/q6rV9/3/

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript">
        function groupA(val) {  
            var x = document.getElementById("groupAB");
            x.options[1].value = val;
            x.options[1].text = val;
            x.options[1].selected="true";
        }

        function groupB(val) {  
            var x = document.getElementById("groupAB");
            x.options[2].value = val;
            x.options[2].text = val;
            x.options[2].selected="true";
        }
    </script>
</head>
<body>
<form>
    <select name="groupa" onchange="groupA(this.value)">
        <option value="A?">Group A</option>
        <option value="A1">A1</option>
        <option value="A2">A2</option>
        <option value="A3">A3</option>
        <option value="A4">A4</option>
    </select>
    <p></p>
    <select name="groupb" onchange="groupB(this.value)">
        <option value="B?">Group B</option>
        <option value="B1">B1</option>
        <option value="B2">B2</option>
        <option value="B3">B3</option>
        <option value="B4">B4</option>
    </select>
    <select name="groupab" id="groupAB">
        <option value="Select">select</option>
        <option value="">A?</option>
        <option value="">B?</option>
    </select>
</form>
</body>
</html>

Upvotes: 1

Jitendra Yadav
Jitendra Yadav

Reputation: 896

Try This Will work-

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
 $(document).ready(function(){
    var str='<select name="answers">';
    $('select').each(function(){

        str+='<option>'+$(this).find('option:selected').text()+'</option>';    
    });

    str+='</select>';
    $('#anwer').html(str);

    });
    </script>
</head>
<body>

<select name="GROUD A">
<option value="Select">Group A</option>
<option value="A1">A1</option>
<option value="A2">A2</option>
<option value="A3">A3</option>
<option value="A4">A4</option>
</select>
<p></P>


<select name="GROUD B">
<option value="Select">Group B</option>
<option value="B1">B1</option>
<option value="B2">B2</option>
<option value="B3">B3</option>
<option value="B4">B4</option>
</select>

<select name="GROUP A&B">
<option value="Select">Selection from Group A and B</option>
<option value="A?">A?</option>
<option value="B?">B?</option>
</select>

<p>
    <div id="anwer"></div>
</p>
</body>
</html>

Upvotes: 0

Related Questions