Put javascript outcome in option select

Question

Hey guys I have here an script:

function getFiles(){
    var query = "";
    if (ifShowSharedFiles()) {
        $(".button-opt").hide();
        query = (FOLDER_ID == "root") ? "trashed=false and sharedWithMe" : "trashed=false and '" + FOLDER_ID + "' in parents";
        if (FOLDER_ID != "root" && FOLDER_PERMISSION == "true") {
            $(".button-opt").show();
        }
    }else{
        $(".button-opt").show();
        query = "trashed=false and '" + FOLDER_ID + "' in parents";
    }
    var request = gapi.client.drive.files.list({
        'maxResults': NO_OF_FILES,
        'q': query
    });

    request.execute(function (resp) {
       if (!resp.error) {
            showUserInfo();
            DRIVE_FILES = resp.items;
            buildFiles();

                for(var i = 0; i < resp.items.length; i++ ){
                         console.log(resp.items[i].title)
                }
       }else{
            showErrorMessage("Error: " + resp.error.message);
       }
    });
}

The console.log gives me the names of the folders I need.

How can I put the console.log in option select.

If I run this getfiles The outcome in console.log is:

Name
Age
Place

With this data I need a select box with 3 option value.

Possible duplicate of [What is the best way to add options to a select from an array with jQuery?](http://stackoverflow.com/questions/170986/what-is-the-best-way-to-add-options-to-a-select-from-an-array-with-jquery) — Ricardo Pontual, Mar 17 '17 at 10:31

Rory McCrossan · Accepted Answer · 2017-03-17T10:44:36.957

2

To achieve this you can use map() to build an array of the option element strings before using append() to add them to the required select element. Try this:

// example response data
var resp = {
  items: [{
    title: 'Foo',
    Id: '1321a34ds'
  }, {
    title: 'Bar',
    Id: 'aaaaaaa'
  }, {
    title: 'Fizz',
    Id: 'bbbbbbb'
  }, {
    title: 'Buzz',
    Id: 'ccccc'
  }]
}

var options = resp.items.map(function(item) {
  return '<option value="' + item.Id + '">' + item.title + '</option>';
});
$('select').append(options.join(''));

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

edited Mar 17 '17 at 10:44

answered Mar 17 '17 at 10:30

Rory McCrossan

331,213
40
305
339

1 more question: i have now title but i want to have an option val and it must come from resp.id – Nayir Nolamaz Mar 17 '17 at 10:41
example items: [{ title: 'Foo' , Id: "1321a34ds" and the option value must be 1321a34ds – Nayir Nolamaz Mar 17 '17 at 10:41
In which case you can just append a `value` attribute. I updated the answer for you – Rory McCrossan Mar 17 '17 at 10:44
I tried after assking and it worked thnx man And thnx to everyone who used the time to help me – Nayir Nolamaz Mar 17 '17 at 10:46

score 0 · Answer 2 · answered Mar 17 '17 at 10:56

just replace this

for(var i = 0; i < resp.items.length; i++ ){ 

console.log(resp.items[i].title); 



}

with below written code. It will solve your problem

var listoption,compllist;          

for(var i = 0; i < resp.items.length; i++ ){             

var title = resp.items[i].title;

listoption += '<option id='+title+' value='+title+'>'+title+'</option>';
            }
            compllist = "<select name='list' id='list'><option>Select</option>"+listoption+"</select>";
            $("#container").html(compllist);

Put javascript outcome in option select

2 Answers2