JSFiddle - React, Tailwind, and code Playground

by Rayon Dabre

HTML

<table>
  <tr>
    <td>Menu</td>
    <td>
      <select name="menu" id="menu">
        <option value="0" selected='selected'>Select Menu </option>
        <option value="1">Menu - 1 </option>
        <option value="2">Menu - 2 </option>
        <option value="3">Menu - 3 </option>
        <option value="4">Menu - 4 </option>
        <option value="5">Menu - 5 </option>
        <option value="6">Menu - 6 </option>
        <option value="7">Menu - 7 </option>
      </select>
    </td>
  </tr>
</table>
<div id="data-menu" align="center">
</div>

JavaScript

$(document).ready(function() {
  $('#menu').change(function() {
    if ($(this).val != 0) {
      var menu_id = $(this).val();
      $.ajax({
        type: "GET",
        url: "menu.php",
        data: {
          menu_id: menu_id
        },
        dataType: "html",
        success: function(response) {
          $("#data-menu").html(response);
        }
      });
    }
  }).change();
});