Lokendra Panwar Lokendra Panwar - 1 year ago 148
Ajax Question

How to display data in select box option using jquery

I want to display data in select box option from ajax response.

here is my view file

<select class="form-control" name="vendor" id="vendor_list" required style="width: 159px;">
<option value="">Vendor 1</option>

Here is my ajax success function

success: function(data) {
$.each(data, function(i, value) {
$('#vendor_list').append('<option value="'+ value.id+'">'+ value.vendor_name +'</option>');

here is my ajax response json data


How to display value in select box.
giv me suggestion.thanks

Answer Source

I think the problem is with

$('#vendor_list').append('<option value="'+ value.id+'">'+ value.vendor_name +'</option>');

It will be much better if you create a option string & append it after entire data has been iterated

Since it is not possible to replicate the ajax , so I have directly use the ajax response

You can put the entire code inside success block , but you will not need var x because data will play role of var x=[...] in your case

var x = [{"vendor_name":"scscss"},{"vendor_name":"xzcdsfdx"}]
var _options =""
$.each(x, function(i, value) {
        _options +=('<option value="'+ value.id+'">'+ value.vendor_name +'</option>');

Check this jsFiddle

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download