Untitled

      <div>
        <label for="dailySelect">Select Month:</label>
        <select id="dailySelect" onchange="filterTable()">
          <?php
          $currentMonth = date('n');
          for ($month = 1; $month <= 12; $month++) {
              $selected = ($month == $currentMonth) ? 'selected' : '';
              $monthName = date('F', mktime(0, 0, 0, $month, 1));
              echo "<option value='$month' $selected>$monthName</option>";
          }
          ?>
        </select>
      </div>

function filterTable() {
  var selectedMonth = document.getElementById("dailySelect").value;
  var year = new Date().getFullYear();
  var xhr = new XMLHttpRequest();
  xhr.onreadystatechange = function() {
    if (xhr.readyState === XMLHttpRequest.DONE) {
      if (xhr.status === 200) {
        var responseData = JSON.parse(xhr.responseText);
        updateTable(responseData);
      } else {
        console.error('Request failed. Error: ' + xhr.status);
      }
    }
  };
  var sqlQuery = "SELECT * FROM tblreserve WHERE status = '1' AND MONTH(date1) = '" + selectedMonth + "' AND YEAR(date1) = '" + year + "'";
  xhr.open('GET', 'fetch_data.php?sql=' + encodeURIComponent(sqlQuery), true);
  xhr.send();
}

function updateTable(data) {
  var tableBody = document.getElementById("dailyTableBody");
  tableBody.innerHTML = "";
  if (data.length > 0) {
    for (var i = 0; i < data.length; i++) {
      var row = document.createElement("tr");
      var nameCell = document.createElement("td");
      nameCell.textContent = data[i].client_name;
      row.appendChild(nameCell);
      var priceCell = document.createElement("td");
      priceCell.textContent = data[i].price;
      row.appendChild(priceCell);
      var dateCell = document.createElement("td");
      dateCell.textContent = data[i].date1;
      row.appendChild(dateCell);
      tableBody.appendChild(row);
    }
  } else {
    var noDataRow = document.createElement("tr");
    var noDataCell = document.createElement("td");
    noDataCell.setAttribute("colspan", "3");
    noDataCell.textContent = "No data available";
    noDataRow.appendChild(noDataCell);
    tableBody.appendChild(noDataRow);
  }
}