I want to create dynamic select option list using javascript or jQuery

Question

I have 3 arrays: one for the value, and 2^nd one for the option name, and the third one for the price.

I want to create a dynamic option list using value and option name (value is channel id and channel name) and, on selection of the channel name, display the sum of the price of the channel in the other textbox.

I am using the below to display the dynamic option name:

var select = document.getElementById("selectNumber4"); 
        var options = channel;
         console.log(options);

         $('#selectNumber4').html('');

        for( option in options ) {
        select.add( new Option( options[option]) );
    };

Possible duplicate of How to dynamically add elements via jQuery — JanWillem Huising
– JanWillem Huising, Commented Aug 31, 2018 at 9:07
Possible duplicate of How to add Drop-Down list (<select>) programmatically? — ggorlen
– ggorlen, Commented Sep 26, 2019 at 4:12

Dhaval Pankhaniya · Accepted Answer · 2018-08-31 10:00:18Z

1

simply try following

var select = $("<select></select>");
var chanels = ["chanel1", "chanel2", "chanel3"]
var chanelValue = ["1", "2", "3"]

for(var i=0;i<chanels.length;i++){
  var option = $("<option></option>");
  $(option).val(chanelValue[i]);
  $(option).html(chanels[i]);
  $(select).append(option);
}

$(".default").append(select);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="default">
<div>

edited Aug 31, 2018 at 10:00

answered Aug 31, 2018 at 9:15

Dhaval Pankhaniya

1,9961 gold badge16 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

ssatish4u Over a year ago

nos of array is dynamic for key/value (channel_id,channel_name)

ssatish4u Over a year ago

And also i want to show price on select of channel in text box

Collectives™ on Stack Overflow

I want to create dynamic select option list using javascript or jQuery

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related