-2

So, I basically have a for in javascript with the variable i that goes from 0 to 23

for($i=0; $i <= 23; $i++)

And I want to clear the current select options of the select that I have (only 1 and 2)

<select id="hour_interview_ini">
 <option>1</option>
 <option>2</option>
</select>

And add the for result in javascript as the new options (in this case, the options would be 0 to 23)

  • Your question makes little to no sense. Please edit it and be more descriptive about the issue – j08691 Oct 02 '19 at 16:52
  • @j08691 Makes sense to me. He wants to generate `...` in the loop. – Barmar Oct 02 '19 at 16:53
  • "I want". What have you tried? – Scott Marcus Oct 02 '19 at 16:54
  • Edited, I've only tried a few simple lines but as I'm new to javascript, I don't know how to put a for into the options. Thank you. – Miguel Leal Oct 02 '19 at 16:55
  • Each time through the loop create the option with the current value of `$i`. Concatenate them all into a string, and put that into the `innerHTML` of the ` – Barmar Oct 02 '19 at 16:55
  • Exactly this yeah, basically, it will be a select with all the hours of the day. – Miguel Leal Oct 02 '19 at 16:56
  • I've just asked a question that I haven't found a solution on the website. I think a purpose of a question is to be new content to the website and to help me and others. – Miguel Leal Oct 02 '19 at 16:58
  • The answer is, more or less, online already. However, if you're new to a language, being able to read and manipulate it is difficult. We don't need to shame or downvote people for being new and not knowing how to use all the tools and resources available to them. [link]https://stackoverflow.com/questions/47824/how-do-you-remove-all-the-options-of-a-select-box-and-then-add-one-option-and-se – HumanHickory Oct 02 '19 at 17:11

1 Answers1

1

I primarily use jQuery, so this is what that would look like. I'll make a codepen too, for you. We've all be new to a language before so I totally get not being able to troubleshoot by yourself!

To clear the list you'll want to do something like this:

$('#hour_interview_ini')
    .find('option')
    .remove()
    .end()
;

And then to add in a loop, you'll want to do this:

for(i = 0; i <= 23; i++){   
   $('#hour_interview_ini').append('<option value="' + i + '">' + i + '</option>')    
  }

However, If you want to do it in javascript, this will work too. I put these ones in as functions (although the jquery could be functions too). If you need to know how to call them, check the code pen. It'll show you how to use the function on a click, or how to access the jQuery ID and trigger a function:

Clearing list (not the best method, but works and is super small):

function clearList(){
   document.getElementById("hour_interview_ini").innerHTML = "";
}

Adding through the loop

function addList(){
 var select = document.getElementById("hour_interview_ini");

 for (var i = 0; i<=23; i++){
    var opt = document.createElement('option');
    opt.value = i;
    opt.innerHTML = i;
    select.appendChild(opt);
    }    
}

https://codepen.io/humanhickory/pen/NWKQLyR

HumanHickory
  • 464
  • 1
  • 6
  • 19