使用内联javascript更新下拉列表

Question

I have a drop-down list implemented as follow:

   <select name="myDDownList" class="none" id="myDDownListID" style="height:25px; width:   280px">

   <?php
   if(file_exists($filesDir))
   {
     foreach (new DirectoryIterator($filesDir) as $file)
     {
       if((htmlentities($file) !== ".") && (htmlentities($file) !== ".."))
       {
         echo "<option>" .htmlentities($file). "</option>";
       }
     }
   ?>
   </select>

The content of the folder $filesDir can be updated automatically by the operating system, and I would like to update the content of the drop-down list automatically as well, without reloading manually the whole page content.

I though I can use an inline Javascript code using the setInterval function, changing the the code this way:

  <select name="myDDownList" class="none" id="myDDownListID" style="height:25px; width: 280px">

  <?php
  if(file_exists($filesDir))
  {
    foreach (new DirectoryIterator($filesDir) as $file)
    {
      if((htmlentities($file) !== ".") && (htmlentities($file) !== ".."))
      {
        echo "<option>" .htmlentities($file). "</option>";
      }
    }
  }
  ?>

  <script>
     /* use 'setInterval' function here */
  </script>
  </select>

But honestly I don't know how to update the content of the drop-down list inside the setInterval function. I think I have to use a function from the Javascript library. But I don't know which function.

Please, could you help me to find out a solution ? Thank you in advance for your help.

Simon

Answer 1

you make a php page "getListDirectory.php"

 <?php
  if(file_exists($filesDir))
  {
    foreach (new DirectoryIterator($filesDir) as $file)
    {
      if((htmlentities($file) !== ".") && (htmlentities($file) !== ".."))
      {
        echo "<option>" .htmlentities($file). "</option>";
      }
    }
  }
  ?>

and your script simply make a request each 15 sec for istance:

setInterval(function(){

$.get( "getListDirecotry.php", function( data ) {
  $("#myDDownListID").html(data);
});

}, 15000);