PHP Implements Message Board Function for Small Programs (End)
Next, the comment function is added to the above article. First, look at the effect map, as shown in the figure below.
I didn't delete comments here, because I didn't do it as I did in the article. Okay, next is the comment function code.
logs.wxml
<form bindsubmit="liuyanban">
<view style="float:left;margin-left:15rpx">Message content:</view>
<input type="text" name="content" style="border:1px solid #ccc"></input>
<button form-type="submit">Submit message</button>
</form>
<view wx:for="{{liuyantext}}" wx:key="{{liuyantext}}">
<view style="margin-top:30rpx;">User name:{{item.uname}}</view>
<view style="">content:{{item.content}}</view>
<view wx:if="{{uids == item.uid}}" >
<navigator style="float:left;margin-right:30rpx;color:#0000FF "url="/pages/update/update? Id={{item.id}"> modify </navigator>
<view bindtap="deletei" style="margin-button:30rpx;color:#0000FF "data-src="{{item.id}"> Delete </view>
</view>
<view bindtap="huifu" data-huifu="{{item.id}}" data-index="{{index}}" style="color:#0000FF "> Comment </view>"
<form bindsubmit="huifus" wx:if="{{item.id == arr}}">
<input name="text" style="border:1px solid #ccc;" type="text"></input>
<button type="primary" form-type="submit">confirm</button>
</form>
<view wx:for="{{huifutext}}" wx:key="{{huifutext}}" wx:for-item="cell">
<view wx:if="{{item.id == cell.blog_id}}">
<view style="margin-top:20rpx;border:1px solid #ccc;color:#FF0000 "> Comment Name: {Cell.uname} </view>
<view style="margin-top:10rpx;color:#FF0000 "> Comments: {{cell. text} </view >
</view>
</view>
</view>
logs.js
Page({
data: {
hidden: true
},
/**
* Life cycle functions -- listening for page loading -- get values from other pages and receive them by line
*/
onLoad: function(options) {
this.setData({
id:options.id,
uid: options.uid,
uname: options.uname
})
var that = this
that.setData({
uids:that.data.uid
})
//Query message
wx.request({
url: 'http://127.0.0.1/liuyanban.php',
data:{
'a':1
},
header: { 'content-type': 'application/json'},
method: 'GET',
dataType: 'json',
success: function(res) {
that.setData({
liuyantext: res.data['0'],
})
console.log('Query value', res.data['0'])
},
})
//Query comments
wx.request({
url:"http://127.0.0.1/huifu.php",
header:{'content-type':'application/json'},
data:{'a':1},
method:'get',
dataType:'json',
success:function(res){
that.setData({
huifutext: res.data['0'],
})
console.log("Comment value",res.data['0'])
}
})
},
//Insert message
liuyanban: function(e) {
if(e.detail.value.content != ""){
var that = this
wx.request({
url: 'http://127.0.0.1/liuyanban.php',
data: {
"uid":this.data.uid,
"uname":this.data.uname,
"content":e.detail.value.content
},
header: { 'content-type': 'application/x-www-form-urlencoded'},
method: 'POST',
dataType: 'json',
success: function(res) {
console.log('Insert data values:',res)
},
})
}
console.log('Message content',e.detail.value.content)
console.log('uid: ', this.data.uid)
console.log('uname:', this.data.uname)
},
//delete
deletei: function (e) {
wx.showModal({
title: 'Tips',
content: 'Are you sure to delete',
success(res) {
if (res.confirm) {
wx.request({
url: 'http://127.0.0.1/update.php',
method:"get",
header: { 'content-type': 'application/json'},
dataType:'json',
data:{
'a':2,
'id': e.currentTarget.dataset.src
},
success:function(){
wx.showToast({
title: 'Delete successful',
icon: 'none',
})
}
})
console.log('User Click Delete')
} else if (res.cancel) {
console.log('User Click Cancel')
}
}
})
},
//Comment function
huifu:function(e){
console.log("Click.:",e.currentTarget.dataset.huifu)
this.setData({
arr: e.currentTarget.dataset.huifu
})
},
huifus:function(e){
wx.request({
url: 'http://127.0.0.1/huifu.php',
method:"post",
header:{ 'content-type': 'application/x-www-form-urlencoded'},
data:{
'blog_id': this.data.arr,
'uid': this.data.uid,
'uname': this.data.uname,
'text': e.detail.value.text
},
dataType:'json',
success:function(res){
wx.showToast({
title: 'Comment success',
icon: 'none',
})
}
})
}
})
These things are not encapsulated. If you want to encapsulate them, you can see my article encapsulated in money. Next is the review of PHP.
huifu.php
<?php
class huifu{
//Query comments
public function select(){
require_once 'config.inc.php';
$sql = "select * from wt_huifu";
try{
$stmt = $link->prepare($sql);
$stmt->execute();
while($row = $stmt->fetch(PDO::FETCH_ASSOC)){
//To convert to json format for applets
$results[] = $row;
}
echo json_encode([$results]);
}catch(PDOException $e){
die($e->getMessage());
}
}
//Insert comments
public function insert(){
require_once 'config.inc.php';
$sql = "insert into wt_huifu(blog_id,uid,uname,text) values(?,?,?,?)";
try{
$stmt = $link->prepare($sql);
$stmt->execute([$_POST['blog_id'],$_POST['uid'],$_POST['uname'],$_POST['text']]);
}catch(PDOException $e){
die($e->getMessage());
}
}
}
$a = new huifu();
if($_GET['a'] == 1){
$a->select();
}else{
$a->insert();
}
?>
There is also a comment function sql statement
create table wt_huifu( id int PRIMARY KEY AUTO_INCREMENT, blog_id int not null, uid int not null, uname varchar(22) not null, text varchar(60) not null )
The best step is to achieve functions step by step, to understand the principles of it, and then send you a source code, there is no SQL, look at the front article, paste copy just fine, what is the problem, welcome comments message, I will reply to you in time.
Source Link: https://pan.baidu.com/s/1wa0uZD5EmprH-rZd2jIhDQ Extraction code: qc1f