Shulou(Shulou.com)06/01 Report--

This article mainly introduces the PHP back-end form form submission method related knowledge, the content is detailed and easy to understand, the operation is simple and fast, has a certain reference value, I believe everyone after reading this PHP back-end form form submission method article will have a harvest, let's take a look at it.

1. Mini Program compared to the previous WEB+PHP site, the personal understanding is just to put the web on Wechat, using the front end of Mini Program fixed format for layout, event trigger and data transmission and reading, the server side can be written in any back-end language, but all the data must be returned to Mini Program in the form of JSON.

two。 Yesterday, I wrote the function of login registration and forgetting password, which is essentially a form submission operation. So use the registration function to write this example.

3. Catalogue chart

Js files are logical controls, mainly because they send requests and receive data

Json is used for the local configuration of this page and overrides the global app.json configuration

Style settings used by wxss for pages

Wxml is the page, equivalent to html

4. Forget the style and json file for the time being, I just want to review the submission of the form form

5.Wxml file code

Registration to get verification code registration login forgot password

6. Several of the key points need to be understood

A.Form form, you need to bind a submit event. In Mini Program, the property is bindsubmit.

The attribute value formSubmit here in bindsubmit= "formSubmit" can be named as any value that conforms to the specification, which is equivalent to onsubmit=formSubmit () in the previous html. It is a function name that triggers the formSubmit function event when it is submitted, which is written in js.

b. The other properties are similar to the previous HTML. Note that the form must have name= "value", and the back-end processing is the same as before, such as name= "username" PHP can be received with $_ POST ['username'].

c. Since Mini Program does not have an input submit button, there must be a submit button in every form form

Register, this button is used to open the submit event.

7.index.js code

Page ({data: {}, formSubmit: function (e) {if (e.detail.value.mobile.length==0 | | e.detail.value.password.length==0) {wx.showToast ({title: 'Mobile number or password must not be empty!', icon: 'loading', duration: 1500}) setTimeout (function () {wx.hideToast ()}, 2000)} else if (e.detail.value.mobile.length! = 11) {wx.showToast ({title:' please enter an 11-digit mobile number!' Icon: 'loading', duration: 1500}) setTimeout (function () {wx.hideToast ()}, 2000)} else if (e.detail.value.password.length 20) {wx.showToast ({title:' please enter 6-20 password!', icon: 'loading', duration: 1500}) setTimeout (function () {wx.hideToast ()} 2000)} else if (e.detail.value.password! = e.detail.value.repassword) {wx.showToast ({title: 'inconsistent password entry!', icon: 'loading', duration: 1500}) setTimeout (function () {wx.hideToast ()}, 2000)} else {wx.request ({url:' https://shop.yunapply.com/home/Login/register', header: {"Content-Type": "application/x-www-form-urlencoded"}) Method: "POST", data: {mobile:e.detail.value.mobile,password:e.detail.value.password}, success: function (res) {if (res.data.status = = 0) {wx.showToast ({title: res.data.info, icon: 'loading', duration: 1500})} else {wx.showToast ({title: res.data.info,// prints login success icon:' success', duration: 1000})}},})

8. It is important to note that

The method Page () is a must, in which a js object is placed to render the effect when the page is loaded.

Data: {}, data object, set the data in the page, and the front end can display it by reading the data in this object.

FormSubmit: methods in function Mini Program are all method names: function (), where function can pass a parameter as the object that triggers the current time.

The following is the execution of the function, because there are too many validations, I only take some of them to understand.

If (e.detail.value.mobile.length==0 | | e.detail.value.password.length==0) {wx.showToast ({title: 'Mobile number or password must not be empty!', icon: 'loading', duration: 1500})

The e here is the object that currently triggers the event, similar to the html onclick=foo (this) "this object. Mini Program encapsulates many built-in calling methods, and e.detail.value.mobile is the value of the current object name=" mobile "e.detail.value.mobile.length is the length of this value.

ShowToast is similar to alert in JS, pop-up box, title is the pop-up box display information, icon is the pop-up box icon status, currently only loading and success these two states. Duration is the time when the pop-up box is displayed on the screen.

9. Here comes the point.

Wx.request ({url: 'https://shop.com/home/Login/register', header: {"Content-Type": "application/x-www-form-urlencoded"}, method: "POST", data: {mobile:e.detail.value.mobile,password:e.detail.value.password}, success: function (res) {if (res.data.status = = 0) {wx.showToast ({title: res.data.info, icon:' loading') Duration: 1500})} else {wx.showToast ({title: res.data.info,// prints login success icon: 'success', duration: 1000})}}, fail:function () {wx.showToast ({title:' server network error!', icon: 'loading', duration: 1500})}})

Wx.request ({}) is the https request initiated by Mini Program. Note that http is not allowed.

Here

A.url is the URL you requested. For example, in the front end, the index.php of action='index.php', in the POST form is the relative path, while the URL requested by Mini Program must be the absolute path to the network.

For example: https://shop.com/home/Login/register

b.

Header: {"Content-Type": "application/x-www-form-urlencoded"}

Because POST and GET transmit data differently, the header of POST must be

"Content-Type": "application/x-www-form-urlencoded"

The header of GET can be 'Accept':' application/json'

c. Be sure to specify method: "POST" defaults to "GET". Keep it uppercase.

Data: {mobile:e.detail.value.mobile,password:e.detail.value.password}

The data here is the data sent by POST to the server in the form of {name:value}.

d. Successful callback function

Success: function (res) {if (res.data.status = = 0) {wx.showToast ({title: res.data.info, icon: 'loading', duration: 1500})} else {wx.showToast ({title: res.data.info, icon:' success', duration: 1000})}}

E.success:function () is the event when the request status is triggered successfully, that is, 200. note that the success of the request is not the success of the operation, but the connection between the program and the server.

Fail:function () is the event triggered by an unsuccessful network request.

f.

If (res.data.status = = 0) {wx.showToast ({title: res.data.info, icon: 'loading', duration: 1500})} else {wx.showToast ({title: res.data.info,// prints login success icon:' success', duration: 1000})}

A piece of code here is related to the PHP back-end program, and the specific process is as follows

1.POST uses data to https://shop.com/home/Login/register this interface, and those who have used THINKPHP will know that it is the register method under the control of Login under the HOME module.

According to the data from POST, the 2.register method performs secondary verification combined with the database. If the operation is successful, what will be returned? if the operation fails, what will be returned?

3. The backend PHP code is as follows:

Controller LoginController.class.php

/ * user registration * / public function register () {if (IS_POST) {$User = D ("User"); if (! $User- > create ($_ POST, 4)) {$this- > error ($User- > getError (),', true);} else {if ($User- > register ()) {$this- > success ('Registration successful!',', true);} else {$this- > error ('Registration failed!', 'true);}}

Model

Register method of UserModel.class.php

Public function register () {$mobile = I ('post.mobile'); $password = I (' post.password'); $res = D ('User')-> add (array (' mobile'= > $mobile, 'password'= > md5 ($password),' modifytime'= > date ("Y-m-d H:i:s")); return $res;} this article on "PHP backend form form submission method" ends here, thank you for reading! I believe that everyone has a certain understanding of the "PHP back-end form form submission method" knowledge, if you want to learn more knowledge, welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.