sooraj subramanyan
sooraj subramanyan

Reputation: 67

How do I populate values of an JSON object data into a selectbox?

when using this code selectbox option value data populate as UNDEFINED..

var obj =  jQuery.parseJSON('['+<?= $customers_json; ?>+']') ;
var myJSON = JSON.stringify(obj);
for (var i = 0; i < myJSON.length; i++)
{
html_code += '<option value="'+myJSON[id].toString()+'">'+myJSON.toString()+'</option>';
}
$sql2 = "SELECT id,name FROM customers";
    $customerResult = $conn->query($sql2);
    //$customers123 = $customerResult->fetch_assoc();
     while($r = mysqli_fetch_assoc($customerResult)) {
      $rows[] = $r;
  }

 $customers123=json_encode($rows);
 $customers_json =  $customers123;

Upvotes: 1

Views: 102

Answers (2)

Mohammad Ali Rony
Mohammad Ali Rony

Reputation: 4905

var myJSON = jQuery.parseJSON('['+"[{\"id\":\"2\",\"name\":\"sooraj\"},{\"id\":\"4\",\"name\":\"ravi pillai\"},{\"id\":\"5\",\"name\":\"jasil\"},{\"id\":\"6\",\"name\":\"athul\"},{\"id\":\"7\",\"name\":\"dheeraj123\"}]"+']') ; 
myJSON =myJSON[0];

let html_code ='';

for (var i = 0; i < myJSON.length; i++)
{
   html_code += '<option value="'+myJSON[i]['id']+'">'+myJSON[i]['name']+'</option>';
}

console.log(html_code);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

For loop will be

for (var i = 0; i < myJSON.length; i++)
{
   html_code += '<option value="'+myJSON[i]['id'].toString()+'">'+myJSON[i]['name'].toString()+'</option>';
}

Upvotes: 1

Ukuser32
Ukuser32

Reputation: 2189

Your solution is to use for and in. Its a good way of traversing an object:

var obj =  jQuery.parseJSON('['+<?= $customers_json; ?>+']');

obj = obj[0][0]; // to account for position within object

for (key in obj)
{
html_code += '<option value="'+key+'">'+obj[key]+'</option>';
}

Bear in mind you may need to remove all the previous options before adding more :o)

Upvotes: 0

Related Questions