mardi 21 novembre 2023

Uncheck one of the checkboxes, and the data from report analysis also will hide one

Please see image, currently the checked checkbox from issue and report analysis data are from table or database.

My question is how if I unchecked one of the checkboxes, the data from report analysis will hide one. Then if I checked one more checkbox it will add one more details for report analysis to be keyed in. I try below code, but unsuccessfully.

enter image description here

document.addEventListener('DOMContentLoaded', function() {
  // Add an event listener for each checkbox
  var issueCheckboxes = document.querySelectorAll('input[name="selectedIssues[]"]');
  issueCheckboxes.forEach(function(checkbox) {
    checkbox.addEventListener('change', function() {
      showAnalysisDropdowns();
    });
  });

  // Initialize the display on page load
  showAnalysisDropdowns();
});

function showAnalysisDropdowns() {
  var issueCheckboxes = document.querySelectorAll('input[name="selectedIssues[]"]');
  var analysisContainer = document.getElementById('analysisContainer');
  var doContainer = document.getElementById('doContainer');

  analysisContainer.innerHTML = ''; // Clear existing "Report Analysis" content
  doContainer.innerHTML = ''; // Clear existing "doNo" and "doQuantity" content

  var analysis_data = [
    <?php
                $analysis = mysqli_query($con, "SELECT analysis_desc, analysis_value FROM list_report_analysis where analysis_status='1'");
                $analysisOptions = array();
                while ($row = mysqli_fetch_array($analysis)) {
                    $analysisOptions[] = $row['analysis_desc'] . ',' . $row['analysis_value'];
                }
                echo '"' . implode('", "', $analysisOptions) . '"';
                ?>
  ];

  for (var i = 0; i < issueCheckboxes.length; i++) {
    if (issueCheckboxes[i].checked) {
      // Create "Report Analysis" dropdowns as before
      var select = document.createElement("select");
      select.name = "analysis_data[]";
      select.innerHTML = '<option value="">Select Report Analysis</option>';

      for (var j = 0; j < analysis_data.length; j++) {
        var parts = analysis_data[j].split(',');
        var desc = parts[0];
        var value = parts[1];
        var option = document.createElement("option");
        option.value = value;
        option.text = desc;
        option.setAttribute('data-analysis-desc', desc);
        select.add(option);
      }

      var sampleNoInput = document.createElement("input");
      sampleNoInput.type = "text";
      sampleNoInput.name = "analysis_sampleNo[]";
      sampleNoInput.placeholder = "Sample No";

      var resultInput = document.createElement("input");
      resultInput.type = "text";
      resultInput.name = "analysis_result[]";
      resultInput.placeholder = "Result";

      var analysisTotalInput = document.createElement("input");
      analysisTotalInput.type = "text";
      analysisTotalInput.name = "analysis_total[]";
      analysisTotalInput.placeholder = "Total Exceed";
      analysisTotalInput.readOnly = true;
      analysisTotalInput.value = '';

      analysisContainer.appendChild(select);
      analysisContainer.appendChild(sampleNoInput);
      analysisContainer.appendChild(resultInput);
      analysisContainer.appendChild(analysisTotalInput);
      analysisContainer.appendChild(document.createElement("br"));
    }
  }

  // Add the "Calculate" button
  var calculateButton = document.createElement("button");
  calculateButton.textContent = "Calculate";
  calculateButton.type = "button";
  calculateButton.onclick = calculateAnalysisTotal;
  analysisContainer.appendChild(calculateButton);
  analysisContainer.appendChild(document.createElement("br"));

  // Hide analysisContainer if no checkboxes are checked
  analysisContainer.style.display = (document.querySelector('input[name="selectedIssues[]"]:checked') ? 'block' : 'none');
}
<table>
  <tr>
    <td><b> Issue : </b></td>
    <td>
      <?php
        // Select issue_ids related to the specified complaintId
        $sql = "SELECT issue_id FROM tblccrs_details WHERE complaintId='" . $_GET['cid'] . "'";
        $result = mysqli_query($con, $sql);

        $issueIdsFromDatabase = array(); // Initialize an array to store issue_ids

        while ($row = mysqli_fetch_array($result)) {
            $explodedList = explode(',', $row['issue_id']);

            // Add the issue_ids to the array
            $issueIdsFromDatabase = array_merge($issueIdsFromDatabase, $explodedList);
        }

        // Remove duplicates from the array
        $issueIdsFromDatabase = array_unique($issueIdsFromDatabase);

        $issue = mysqli_query($con, "SELECT * FROM list_issue_ts where issue_ts_status='1'");

        while ($row = mysqli_fetch_array($issue)) {
            $issueId = $row['issue_id'];
            $issueDesc = $row['issue_ts_desc'];

            // Check if the issue_id is in the selected issues array
            $isChecked = in_array($issueId, $issueIdsFromDatabase);

            echo '<input type="checkbox" name="selectedIssues[]" value="' . $issueId . '" ' . ($isChecked ? 'checked' : '') . ' onchange="showAnalysisDropdowns()"> ' . $issueDesc . '<br>';
        }
        ?>
    </td>
  </tr>

  <tr height="50">
    <td colspan="2"> <b>Report Analysis : </b> </td>
  </tr>

  <tr>
    <td colspan="2">
      <?php
        $a = 1;
        $sql = "SELECT analysis_desc, analysis_sampleNo, analysis_result, analysis_total FROM tblccrs_report_analysis WHERE complaintId='" . $_GET['cid'] . "'";
        $result = mysqli_query($con, $sql);
        ?>

        <?php while ($row = mysqli_fetch_array($result)) { ?>
        <div class="analysis-container">
          <label for="analysisData<?php echo $a; ?>">
                    <?php echo $a ?>. <?php //echo $row['analysis_desc']; ?>
                </label>
          <select name="analysisData<?php echo $a; ?>" onchange="calculateAnalysisTotal(this)">
            <!-- Populate options dynamically as before -->
            <?php
                    $analysisDesc = $row['analysis_desc'];
                    $analysisValue = $row['analysis_value'];

                    $allAnalysisQuery = "SELECT DISTINCT analysis_desc, analysis_value FROM list_report_analysis WHERE analysis_status='1'";
                    $allAnalysisResult = mysqli_query($con, $allAnalysisQuery);

                    while ($descRow = mysqli_fetch_assoc($allAnalysisResult)) {
                        $selected = ($descRow['analysis_desc'] == $analysisDesc) ? "selected" : "";
                        echo '<option value="' . $descRow['analysis_desc'] . '" data-analysis-value="' . $descRow['analysis_value'] . '" ' . $selected . '>'
                            . $descRow['analysis_desc'] . '</option>';
                    }
                    ?>
          </select>

          <br> Sample No: <input type="text" name="analysis_sampleNo[]" value="<?php echo $row['analysis_sampleNo']; ?>">
          <br> Result: <input type="text" name="analysis_result[]" value="<?php echo htmlentities(number_format($row['analysis_result'], 2)); ?>">
          <br> Exceed: <input type="text" name="analysis_total[]" value="<?php echo htmlentities(number_format($row['analysis_total'], 2)); ?>" readonly>
          <br>

          <!-- Add the "Calculate" button -->
          <button type="button" onclick="calculateAnalysisTotal(this)">Calculate</button>
          <br />
          <hr />
        </div>
        <?php $a++;} ?>
    </td>
  </tr>
  <tr>
    <td colspan="2">
      <div id="analysisContainer"></div>
    </td>
  </tr>
</table>



Aucun commentaire:

Enregistrer un commentaire