html+php网上预约网页及表单数据保存到mysql

做的是个仓库预约的小demo

后台是php写的 ,因为没学过前端知识和后台技术。网页也是在网上扒拉来的模板改的,所以不规范地方请自行更改。

这是原网页在这里插入图片描述

这是我改的:在这里插入图片描述

由于单纯的一个静态html网页在实际应用中没什么卵用,需要搭配后台,才能够将网页提交的数据送往你想存储的地方或者在进行二次处理。也就是说 在你点击submit(图中提交申请按钮)按钮之后,剩下的事情就的由后台处理了。写后台的语言有很多,搭建后台所需的环境也有不同的方法。

我用的是php+html表单提交数据保存到mysql中

php代码:welcome.php

<?php
$name = $_POST["name"];   //将html网页中你想提交的数据的name属性标明
$sex = $_POST["sex"];
$age = $_POST["age"];
$tel = $_POST["tel"];
$orderTime = $_POST["orderTime"];
$description = $_POST["description"];
//架设在本机的MySql的名字,用户,密码(我设的空密码),及你创建好的库mydb
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "myDB";
 
// 创建数据库连接
$conn = new mysqli($servername, $username, $password, $dbname);
// 检测连接
if ($conn->connect_error) {
    die("0000: " . $conn->connect_error);
} 
 //将html中我想提交的数据全部存储到数据库中
$sql = "INSERT INTO second_test(name, sex, age, tel, orderTime, description)
VALUES ('$name', '$sex', $age, '$tel', '$orderTime', '$description')";
 //如果添加到MySql成功就跳转页面“1111”表示添加成功
if ($conn->query($sql) === TRUE) {
    echo "1111";
} else {
    echo "Error: " . $sql . "<br>" . $conn->error;
}
 
$conn->close();
?>

提交成功后:在这里插入图片描述
后台数据库新增加一条预约:在这里插入图片描述

整套项目我已上传smartStorage.zip在这里插入图片描述

html代码: index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>粮仓存储预约</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<link rel="stylesheet" href="css/yuyue.css" />
<LINK rel=stylesheet type=text/css href="css/datepicker.css">
<SCRIPT type=text/javascript  src="js/jquery-1.6.2.min.js"></SCRIPT>
<SCRIPT type=text/javascript  src="js/jquery.datepicker-mi.js"></SCRIPT>
<SCRIPT type=text/javascript  src="js/form.js"></SCRIPT>
</head>

<body>
<div class="yuyue_box">
  <div class="yuyue_head"><img src="images/yuyue_top.jpg" width="1366" height="86" /></div>
  <div class="telcon">
    <div class="tell">
      <div class="ts"> <span>提示:</span>
        <p>您所填资料将会被保密,请放心填写。<br />
          请填写详细的个人及作物信息<br />
          方便我们提前了解您的情况,为您备选合适的仓位。</p>
      </div>
      <div class="telform">
        <form action="welcome.php" method="post">
          <input type="hidden" name="sectionid" value="41">
          <input type="hidden" name="orderExpert" value="81">
          <div class="telc">
            <label>用户姓名:</label>
            <input type="text" d="name" id="name" value="" name="name" />
          </div>
          <div class="telxb">
            <label>用户性别:</label>
            <input type="radio" checked="checked" class="sontelxb" value="man" name="sex" />
            &nbsp;男&nbsp;&nbsp;&nbsp;&nbsp;
            <input name="sex" type="radio" value="woman" />
            &nbsp;女</div>
          <div class="telc">
            <label>年龄:</label>
            <input type="text" id="ageses" value="" name="age" />
          </div>
          <div class="telc" style=" margin-bottom:2px">
            <label>联系电话:</label>
            <input  id="tel" type="text" value="" name="tel" />
          </div>
          <p style=" margin-top:1px">*请准确填写,此号码为与您联系的号码</p>
          <div class="telrq">
            <label>预约日期:</label>
            <input type="text" id="time" class="date-pick" 	onclick="this.value='';this.style.color='black';this.style.background='images/420bf521c6dd4a13ac016894278546d0.gif';" value="点击选择预约时间" name="orderTime" />
          </div>
          <div class="telbq">
            <label>预约作物描述:</label>
            <textarea name="description"></textarea>
          </div>
          <p>*请尽量详细填写农作物相关属性,方便我们更好的了解您的产品以便安排相应仓位</p>
		  <input type="submit" name="sub" value=" " class="tijiao" />
          <script language=javascript>
			<!--
			var url = document.referrer;
			document.writeln("<input type=\"hidden\" name=\"URL\" value="+url+">");
			//-->
			</script>
        </form>
      </div>
      <div class="bdz">
        <FORM style="DISPLAY: none" id=lxb-data-form>
          <INPUT id=uid name=uid value=2398773 type=hidden>
          <INPUT id=ttk name=ttk type=hidden>
        </FORM>
      </div>
    </div>
    <div class="telr"> <img src="images/yuyue_07.jpg" width="457" height="704" border="0" usemap="#yuyuecase_Map"  /> 
 </div>
    <div style="clear:both"></div>
  </div>
  <div class="footel">
    <div>准确记录个人信息,特殊农产品针对其相关属性及对环境温湿度等条件特殊要求要明确记录在预约作物描述中。</div>
    <p>XX大学研究小组拥有最终解释权</p>
  </div>
</div>
</body>
</html>

  • 3
    点赞
  • 12
    收藏
    觉得还不错? 一键收藏
  • 5
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值