小程序提交表单mysql_微信小程序form表单提交到MYSQL实例（PHP）

小程序相对于之前的WEB+PHP建站来说，个人理解为只是将web放到了微信端，用小程序固定的格式前前端进行布局、事件触发和数据的输送和读取，服务器端可以用任何后端语言写，但是所有的数据都要以JSON的形式返回给小程序。

下面举例将个人信息提交表单到数据库实例

先来看看目录结构图

·js文件是逻辑控制，主要是它发送请求和接收数据，

·json 用于此页面局部 配置并且覆盖全局app.json配置，

·wxss用于页面的样式设置，

·wxml就是页面，相当于html

样式和json文件暂时不管了，回顾一下form表单的提交

wxml文件代码：

姓名

性别

男

女

爱好

旅游

看书

电动

篮球

提交

重置

其中几个关键点需要理解：

A.Form表单，需要绑定一个submit事件，在小程序中，属性为bindsubmit,

bindsubmit=”formSubmit”这里的属性值formSubmit，命名可以为符合规范的任意值，相当于以前html中的  οnsubmit=”formSubmit()”,是一个函数名，当提交的时候触发formSubmit这个函数事件，这个函数写在js中。

B.其他的属性和之前的HTML差不多，注意的是，表单一定要有name=“value”，后端处理和以前一样，比如name=”username” PHP可以用 $_POST[‘username']来接收。

C.由于小程序没有input submit这个按钮，所以在每个form表单中都要有一个提交按钮，

提交，这个按钮就是用来开启提交事件的。

index.js代码：//index.js

//获取应用实例

const app = getApp()

Page({

data: {

},

formSubmit: function (e) {

//console.log(e.detail.value);

if (e.detail.value.xingming.length == 0 || e.detail.value.xingming.length >= 8) {

wx.showToast({

title: '姓名不能为空或过长!',

icon: 'loading',

duration: 1500

})

setTimeout(function () {

wx.hideToast()

}, 2000)

} else if (e.detail.value.xingbie.length == 0) {

wx.showToast({<