个人中心
gpt4 book ai didi

javascript - 如何在php中实现 “show sub-checkbox”？

转载 作者：行者123 更新时间：2023-12-02 15:28:09 26 4
gpt4 key购买 nike

我使用面向对象的 php 或 prep 语句来绑定(bind)数据库中的所有医学测试列表，我的问题是如何在 php 中实现显示子复选框？如果单击实验室的复选框，所有子复选框都会显示吗？我认为 JavaScript 不起作用

这是医学测试复选框的 php 代码

  <?php
    $tsql = "select medTestName from medtest";
    $tstmt = $con->prepare($tsql);
    $tstmt->execute();
    $tstmt->bind_result($mtn);
    $tstmt->store_result();

    while ($tstmt->fetch()){
    $d1= '<input type="checkbox" name="test[]"
     value="'.$mtn.'">'.$mtn.'<br>';
    echo $d1;
    }       

    ?>

这是子复选框的代码

<div><input type="checkbox" name="topic" value="1"><span>Complete Blood Count</span></div>
<div><input type="checkbox" name="topic" value="2"><span>Blood Typing</span></div>
<div><input type="checkbox" name="topic" value="3"><span>Urinalysis</span></div>
<div><input type="checkbox" name="topic" value="4"><span>RPR/TPHA</span></div>
<div><input type="checkbox" name="topic" value="5"><span>Hepatitis B screening</span></div>
<div><input type="checkbox" name="topic" value="6"><span>Fasting Blood Sugar</span></div>
<div><input type="checkbox" name="topic" value="7"><span>Creatinine</span></div>
<div><input type="checkbox" name="topic" value="8"><span>Total Cholesterol(Low Cholesterol, High Cholesterol)</span></div>
<div><input type="checkbox" name="topic" value="9"><span>Triglyceride</span></div>
<div><input type="checkbox" name="topic" value="10"><span>VLDL</span></div>
<div><input type="checkbox" name="topic" value="11"><span>Blood Uric Acid</span></div>
<div><input type="checkbox" name="topic" value="12"><span>Anti-HAV Igm Screening</span></div>
<div><input type="checkbox" name="topic" value="13"><span>Anti HBaAg</span></div>
<div><input type="checkbox" name="topic" value="14"><span>Drug & Alcohol Test</span></div>
<div><input type="checkbox" name="topic" value="15"><span>Stool Culture</span></div>

这是我的体检结果

enter image description here

这是我的医学测试数据库

enter image description here

很抱歉这篇文章很长，我真的不知道该怎么办:(

最佳答案

这就是你的想法吗？

我创建了两个 PHP 数组:一个包含所有测试，另一个包含所有主题。首先，我们迭代测试数组并打印出每个项目。在每次迭代中，我们循环遍历主题并打印出每个项目(确保每个元素都有一个唯一的 ID)。

生成 HTML 后，我们使用 jQuery 隐藏包含每个测试主题的字段集。然后，我们将一个点击处理程序附加到每个测试复选框，以隐藏或显示嵌套主题。

显然，您的 $tests 数组将由数据库查询的结果填充，如原始代码所示。为了演示目的，我对我的进行了硬编码。

<!DOCTYPE html>
<html>
  <head>
    <title>Medical Stuff</title>
  </head>
  <body>
    <h1>Medical Stuff</h1>

    <?php
      $tests = array(
        "Vital Signs",
        "Neuro-Psychological",
        "Laboratory",
        "Radiology",
        "Ultrasound",
        "Audiometry",
        "Optometry",
        "ECG",
        "Treadmill",
        "Dental",
        "Physical Examination",
        "Pediatrics",
        "MRI"
      );
      $topics = array(
        "Complete Blood Count",
        "Blood Typing",
        "Urinalysis",
        "RPR/TPHA",
        "Hepatitis B screening",
        "Fasting Blood Sugar",
        "Creatinine",
        "Total Cholesterol(Low Cholesterol, High Cholesterol)",
        "Triglyceride",
        "VLDL",
        "Blood Uric Acid",
        "Anti-HAV Igm Screening",
        "Anti HBaAg",
        "Drug & Alcohol Test",
        "Stool Culture"
      );
      $tests_length = count($tests);
      $topics_length = count($topics);
    ?>

    <form>
      <fieldset>
        <legend>Tests</legend>

        <?php
          // Tests
          for ($i = 0; $i < $tests_length; $i++) {

            $test_value = $i + 1;
            $test_id = "test_" . $test_value;

            print '<div>';
            print '<input type="checkbox" class="test" id="' . $test_id . '" value="' . $test_value . '">';
            print '<label for="' . $test_id . '">' . $tests[$i] . '</label>';

            // Nested topics
            print '<fieldset class="topics">';

            for ($ii = 0; $ii < $topics_length; $ii++) {

              $topic_value = $ii + 1;
              $topic_id = $test_id . "_topic_" . $topic_value;

              print '<div>';
              print '<input type="checkbox" class="topic" id="' . $topic_id . '" value="' . $topic_value . '">';
              print '<label for="' . $topic_id . '">' . $topics[$ii] . '</label>';
              print '</div>';
            }

            print '</fieldset>';
            print '</div>';
          }
        ?>

      </fieldset>

      <input type="submit" value="Submit">
    </form>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script>
      jQuery(document).ready(function($){

        $(".topics").hide();

        $(".test").on('click', function(e){
          var topics = $(this).nextAll('.topics');

          if ($(this).is(':checked')) {
            topics.show();
          } else {
            topics.hide();
          }
        });

      });
    </script>
  </body>
</html>

上面的代码最终看起来像这样:

enter image description here

关于javascript - 如何在php中实现 “show sub-checkbox”？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33534058/

26 4 0
文章推荐： javascript - 为什么 trim 子字符串和非捕获不起作用？
文章推荐： hibernate - Grails 服务抛出异常 "org.hibernate.HibernateException: No Hibernate Session bound to thread, and configuration does not allow ..."
文章推荐： grails - Geb-Spock测试无法选择dd文本
文章推荐： javascript - localStorage更改字体颜色
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com