根据用户选择将 MYSQL 表中的数据输出为 HTML 表单

2024-01-01

我有一个 MYSQL 表(roomcost),用于保存租用房间的成本。



costID  Room    Cost
1       room1   15
2       room2   30
3       room3   50
  

rsRoomCost SQL 是:SELECT * FROM roomcost

HTML 表单具有复选框,允许租用者选择房间 1、房间 2 或房间 3。租用者可以租用一间、任意两间或全部三间房间。

<input type="checkbox" name="room1" value="room1" onClick="Check()">Room 1</div>
<input type="checkbox" name="room2" value="room2" onClick="Check()">Room 2</div>
<input type="checkbox" name="room3" value="room3" onClick="Check()">Room 3</div>

该表格还有一个针对每个房间的输入框(一旦我开始工作,该输入框将被隐藏),该输入框将填充表格中的适当费用。提交表格后,租用者的记录将保存租用者在租用时所选择的房间和支付的费用。

该 JS 脚本检查是否选择了特定复选框并将成本输出到相关输入框。

function Check() {
    if (document.forms["bookform"].room1.checked) {
        document.forms["bookform"].thisRoom1.value = "<?php echo($row_rsRoomCost['room1']; ?>";
    } else if (document.forms["bookform"].room2.checked) {
        document.forms["bookform"].thisRoom2.value = "<?php echo($row_rsRoomCost['room2']; ?>";
    } else if (document.forms["bookform"].room3.checked) {
        document.forms["bookform"].thisRoom3.value = "<?php echo($row_rsRoomCost['room3']; ?>";
    } 
}

输出的输入框是:

Room 1: <input type="text" name="thisRoom1" value="">
Room 2: <input type="text" name="thisRoom2" value="">
Room 3: <input type="text" name="thisRoom3" value="">

如您所见,我正在尝试使用 php 填充数据库表中的相关值。然而,当然,这仅显示成本表中第一条记录的成本,无论检查哪个房间。

如何将表格中所选房间的费用输入到表格上的正确输入框中?

我试过了<?php echo($row_rsRoomCost['room1']) where ($row_rsRoomCost['costID']) = '1'; ?>但这行不通。我考虑过“案例”陈述,但不知道它是如何运作的。我能想到的唯一方法是为每个房间使用单独的 SQL 语句。例如:SELECT * FROM roomcost WHERE costID = 1

如何将表格中所选房间的费用输入到表格上的正确输入框中?


通过你的代码,我发现这将是解决它的漫长之路。

  • 解决这个问题的第一步是将数据放入可重用的前端源中,例如 JSON(更容易使用)。

示例:(结果在控制台日志F12中)

                <?php

            $servername = "localhost";
            $username = "root";
            $password = "jono23";
            $dbname = "helpothers";

            // Create connection
            $conn = new mysqli($servername, $username, $password, $dbname);
            // Check connection
            if ($conn->connect_error) {
                    die("Connection failed: " . $conn->connect_error);
            }

            $sql = "SELECT * FROM `roomcost`";
            $result = $conn->query($sql);

            if ($result->num_rows > 0) {
                    // output data of each row
                    while($row = $result->fetch_assoc()) {
                            // echo "id: " . $row["costID"]. " - Name: " . $row["room"]. " " .$row["cost"]. "<br>";


                            // data you want to send to json
                            $data[] = array(
                                    'id' => $row['costID'],
                                    'room' => $row['room'],
                                    'cost' => $row['cost']
                            );

                            //}

                    }
            } else {
                    echo "0 results";
            }
            $conn->close();



            $json_data = json_encode($data);


            //print_r($json_data);






            ?>

            <!DOCTYPE html>
            <html lang="en" dir="ltr">
            <head>
                    <meta charset="utf-8">
                    <title></title>
            </head>
            <body>
                    <form id='bookform' >
                            <input type="checkbox" name="room1" value="room1" onClick="Check()">Room 1</input>
                            <input type="text" name="room1value"  readonly><br>
                            <input type="checkbox" name="room2" value="room2" onClick="Check()">Room 2</input>
                            <input type="text" name="room2value"  readonly><br>
                            <input type="checkbox" name="room3" value="room3" onClick="Check()">Room 3</input>
                            <input type="text" name="room3value" readonly><br>
                    </form >
                    <script type="text/javascript">
                    var Rooms = JSON.parse('<?php print_r($json_data) ; ?>');

                    console.log(Rooms);


                    function Check() {

                            //room1
                            if (document.forms["bookform"].room1.checked)
                            {
                                    document.forms["bookform"].room1value.value = Rooms[0].cost;
                                    console.log(Rooms[0].cost);
                            }else{
                                    document.forms["bookform"].room1value.value ='';
                            }

                            //room2
                            if (document.forms["bookform"].room2.checked)
                            {
                                    document.forms["bookform"].room2value.value = Rooms[1].cost;
                                    console.log(Rooms[1].cost);
                            }else{
                                    document.forms["bookform"].room2value.value ='';
                            }


                            //room3
                            if (document.forms["bookform"].room3.checked)
                            {
                                    document.forms["bookform"].room3value.value = Rooms[2].cost;
                                    console.log(Rooms[2].cost);
                            }else{
                                    document.forms["bookform"].room3value.value ='';
                            }
                    }



                    </script>

            </body>
            </html>
  • 通过首先将 SQL 查询结果编码到 json 数组中,您可以 关闭数据库连接,以免占用不必要的资源 根据多个请求

  • 然后通过将 PHP JSON 对象调用到 JavaScript 中,您可以更轻松地将其应用于您的 html 和 JavaScript 需求

  • 将 PHP 数据转换为 JSON 并使用 JavaScript 进行解析 帮助我们处理诸如 Rest api 之类的事情

这是 JSON 实现可以在多种语言中找到的主要原因,因为它是跨不同编码语言共享数据的简单方法

我对数据处理提出的另一个建议是不要将值存储在复选框中。为此目的创建另一个文本输入并将它们存储在那里。例如

<input type='text' id='gethandle1'>
<script>
let box1 = document.getElementById('gethandle1');
box1.value = Rooms[0].cost; 
</script>

我希望这可以帮助你 。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

根据用户选择将 MYSQL 表中的数据输出为 HTML 表单 的相关文章

  • 如何向 Parse Signup 功能添加额外属性?

    我想向我的解析注册函数添加一个额外的属性 我的代码就像 signUp function e var self this var username this signup username val var password this sign
  • 展开/折叠 div

    我在 PHP MySQL 生成的单个页面上有多个展开 折叠框 问题是 当我单击一个链接来展开一个框时 它会展开所有框 我考虑过在课程末尾附加帖子 ID div class postreplycontainer POST ID 但我不确定这是
  • 正则表达式 - 使用正则表达式提取电子邮件文档的子字符串

    我正在尝试使用正则表达式提取电子邮件文档的子字符串 我正在在线测试正则表达式 它运行得很好 在线正则表达式测试器 https regex101 com r BbWBPk 1 我有一个功能可以检查 Google Apps 脚本上的正则表达式
  • 是什么导致 console.timeEnd() 中出现“myTimer 不存在”错误?

    我为 RxJS 创建了一个演示scan 方法 但不幸的是我的计时器无法正常工作 并且出现此错误 Timer myTimer does not exist console time myTimer let source Rx Observab
  • 如何在 blaze-html 中渲染 blaze-svg 标记

    我想将使用 blaze svg 生成的 svg 图直接包含在使用 blaze html 生成的 html 中 两者都基于 blaze markup 所以我希望它很容易 diagram1 Svg diagram1 try1 Html try1
  • 为什么 React 会删除我的类名?

    我正在学习 Reactjs 并且正在使用一些组件渲染一个简单的页面 该组件之一是 class Header extends React Component render return
  • Meteor 独特客户端集合的发布/订阅策略

    使用 Meteor 我想知道如何最好地处理共享相同服务器端数据库集合的不同客户端集合 考虑以下示例 我有一个User集合 在我的客户端我有一个好友用户列表我有一个搜索功能 可以对整个用户数据库执行查询 返回一个与查询匹配的用户名列表 在发布
  • 在本地计算机上安装 magento 后,我忘记了管理员密码

    在我的本地计算机上安装 magento 后 我忘记了我提供的管理员密码 我无法登录我的管理区域 如何重置密码 我读过这篇文章http www atwix com magento reset admin password mysql http
  • jQuery 拖放而不破坏拖动的项目

    我在以下方面遇到一些困难 需要一些关于如何 简单地 实现这一目标的指导 使用 jQuery 我如何将一个对象拖动到容器中 为事件注册它 并将原始拖动的项目保留在适当的位置 这很难解释 所以我能给出的最好的就是一个带有工作示例的网站 在此输入
  • EmberJS 支持单字母单词模型吗?

    我无法真正确定问题是 Ember 还是 Ember 数据 或者甚至是一个问题 但发生的情况如下 假设你的模型被称为tell me a story 如果您使用 ActiveModelAdapter 这将是您的 JSON 应该提供的名称 无论如
  • fillRect(0,0,0,1)和clearRect()有什么区别

    之间有什么区别 ctx fillStyle rgba 0 0 0 1 ctx fillRect 0 0 100 100 and ctx clearRect 0 0 100 100 性能或生成的图像或画布数据有什么差异吗 更新以对应有问题的
  • Eslint throws 被分配了一个值但从未使用过,webpack 模块

    我正在 webpack 中导入脚本 一切正常 但 eslint 抛出错误 modal is assigned a value but never used 是否必须将 const 声明为全局变量或导出模块才能修复错误 module vani
  • 如何通过javascript设置content-disposition = Attachment?

    我该如何设置content disposition attachment通过JavaScript 基本上 我想在页面通过 Javascript 加载后使用 Firefox 强制执行 另存为 操作 我怎样才能做到这一点 内容处置是响应头 ht
  • 当变量更新时动态刷新模板的一部分golang

    在Golang中 当变量更新时可以刷新模板的一部分吗 例如 我们可以在 Angular js 中找到这一点 基本上在我的代码中 我通过 ajax 中的邮政编码查找地址 它显示我找到的该邮政编码的用户列表 Here is a sample o
  • 在文本基线上水平对齐块

    我有以下 HTML 代码
  • Toastr js添加批准/不批准按钮

    我正在尝试将 Toastr js 设置为某种对话框按钮 我所需要的只是 Toastr 消息上的 批准 和 拒绝 按钮 toastr options closeButton true debug false positionClass toa
  • 每 2 秒打印一次从 1 到 10 的数字

    我想每 n 秒后打印一次数字 并且根据一些条件我正在更改计时器以及停止打印功能 我已经这样做了 var myfunc value 1 running false timer 1000 start function this running
  • 按按钮,启动带有附件的本机电子邮件程序(位于网络服务器上)

    我已经尝试了所有不同版本的发送电子邮件 但尚未实现以下目标 Javascript 或 HTML 按钮 按下时打开带有附件的本机邮件应用程序 附件与网页位于同一服务器上 例如 web www something com file www so
  • 获取数组中最高的角色

    我目前有一个数组u roles其中充满了来自 581199939464462340 等组的 ID 其次 我有一个字典 其中键是角色 ID 值是名称 例如 key 581199939464462340 value Member 现在我想获取数
  • 在 Symfony 2 项目中安装 Bootstrap 主题

    我正在考虑安装这个主题 http bootswatch com superhero 在我的SF2项目中 我注意到页面顶部有4个文件可供下载 即 bootstrap min css 引导程序 css 无变量 bootswatch less 我

随机推荐

  • 将 LogManager.GetLogger 与 Unity 结合使用

    给定这个类 class Foo readonly ILog log public Foo ILog log this log log 我想配置 Unity 来注入 ILog 这很容易 container RegisterInstance
  • 如何对 Visual3D 或 UIElement3D 等 3D 元素使用数据绑定

    我的视图模型中有一堆项目 我将使用 Viewport3D 以 3D 形式渲染它们 UI 的相关部分定义如下
  • 如何将本地裸仓库导入到Gogs中?

    我的主机上有一些裸露的 Git 存储库 后来我在同一台主机上安装了 Gogs 我将其配置为使用完全相同的文件夹来存储存储库 我的裸存储库已经驻留在其中 我怎样才能导入它们 事实上我不需要 导入 任何东西 我只是想让Gogs认识到他们的存在
  • 我可以在Scheme 的过程内部定义一个全局变量吗?

    我有一种情况 我想做一些类似的事情 define def a b store a b store the definition of a somewhere define global a b also define a so that i
  • 获取 php 数组中的下一个值

    我想获取 PHP 数组中的下一个值 例如 array array a b c d e f current array val c so I want to run a code to get the next value in the ar
  • chrome 取消了经典的头像菜单吗?

    与许多 Web 开发人员一样 我在 Google Chrome 中维护大量配置文件 以便测试 Web 应用程序 在进行这些测试时 必须快速确定与 Chrome 交互时我所处的配置文件 我依靠经典的 Chrome 头像菜单来指示当前的个人资料
  • 尝试在 infile.open() 中使用字符串变量在 C++ 中被视为 char

    我正在尝试制作一个程序 其中用户输入文件名 然后程序尝试打开它并检查它是否已打开 我正在使用 getline 函数 到目前为止 这是我的代码 include
  • PHP md5 解释

    我正在开发这个 PHP 项目 并且有很多地方使用了 md5 我什至已经使用过它很多次了 但直到今天我仍然不清楚这个功能是做什么的 我意识到它会解密传入的值 但是如何撤消它以使其恢复到原始值 也许我不清楚整个过程 如果有人有有关该过程的信息
  • 如何使用 Iphone 应用程序获取设备令牌以及有关设备的其他信息?

    在我的 iPhone 应用程序中 我想要使用 APN 的设备令牌 如何使用代码获得它 另外 我想要有关设备用户 其版本和其他信息的其他信息 如何使用代码获得它 是否可以使用Device Token获取设备的其他信息 设备令牌的格式是什么 请
  • 在 UIViewController 的主视图中加载自定义 UIView

    我对 UIView 进行了子类化并创建了一个 NIB 来控制应用程序的主要逻辑 希望视图能够很好地缩放 我想将它用于该应用程序的 iPhone 和 iPad 版本 在 iPhone 上 视图将覆盖全屏 在 iPad 上 视图将仅覆盖屏幕的一
  • 用于验证的 OO 设计模式

    我正在根据这些假设编写一些验证代码 Validation code must be in an external class 即没有数据类包含它自己的验证 The same object can be validated in differ
  • group by 中的 group by 和average

    我有一个像这样的数据框 cluster org time 1 a 8 1 a 6 2 h 34 1 c 23 2 d 74 3 w 6 我想计算每个集群每个组织的平均时间 预期结果 cluster mean time 1 15 8 6 2
  • WCF:远程服务器返回错误:(413)请求实体太大[重复]

    这个问题在这里已经有答案了 我有一个wcf服务 有一种方法可以获取base64字符串来上传文件我的文件大小为100kb 随着时间的推移它可能会更大 我收到错误消息 远程服务器返回错误 413 请求实体太大 同时尝试获取 HttpWebRes
  • 使用 ifelse 从 R 数据集中删除不需要的行

    我有一个数据集 我想删除我的几个人在第一个观察年中第 11 个月出现的情况 是否可以用 if else 来做到这一点 就像是 ifelse ID 1 Month 11 and Year 2006 remove these rows ifel
  • OS X Lion 上的 Eclipse Indigo 输入延迟

    我正在做一个相当大的项目 最近遇到了我的 90 年代的好老朋友 打字滞后 我的设置是配备 SSD 驱动器的 MacBook Pro 2 2 GHz i7 8GB 到目前为止还没有出现任何严重的性能问题 我已将内存分配增加到 Xmx1024m
  • Bootstrap,对布局进行响应式更改

    我在设计中使用了流畅的 Twitter Bootstrap 布局 并将使其具有响应能力 考虑这样的网格 div class row fluid div class span4 div div class span8 div div 隐藏 s
  • firebase 库实现出现 Appcompat 错误

    您好 我有一个关于添加 firebase 依赖项的小问题 当我添加这一行时 implementation com google firebase firebase core 17 0 0 在我的 build gradle 中 我看到一条错误
  • 如何在 Windows Phone 8.1 中添加 AppBar

    在Windows Phone 8中 添加应用程序栏并管理它非常容易 但现在我测试新的Windows Phone 8 1 SDK来构建具有新地理围栏功能的项目 但我不知道如何在应用程序中添加应用程序栏 在Windows Phone 8 1中
  • 如何使用另一个测试结果中的标签来标记 ggplot 中的条形图?

    我想用测试的标签输出来标记我的图 例如 使用 agricolae 库中的 LSD test 进行 LSD 测试输出 a b ab 等 这是运行的示例 library ggplot2 library agricolae wt lt gl 3
  • 根据用户选择将 MYSQL 表中的数据输出为 HTML 表单

    我有一个 MYSQL 表 roomcost 用于保存租用房间的成本 costID Room Cost 1 room1 15 2 room2 30 3 room3 50 rsRoomCost SQL 是 SELECT FROM roomcos