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

This article mainly introduces "how to use php to achieve comment reply function". In daily operation, I believe many people have doubts about how to use php to achieve comment reply function. The editor consulted all kinds of materials and sorted out simple and easy-to-use operation methods. I hope it will be helpful for you to answer the doubts about "how to use php to achieve comment reply function". Next, please follow the editor to study!

This article operating environment: windows7 system, PHP7.1 version, DELL G3 computer

How does php implement the comment reply function?

Php unlimited level classification to realize the function of comment and reply

We often see the comment function at the bottom of the details pages of major forums or news sections. Of course, it is not just as simple as posting comments directly. You can reply to other people's comments, and others can comment or reply to your reply again. So repeatedly, in theory, it can be said that there is no end. From a technical point of view, it is easy to think of using unlimited classification technology to store data. Use recursion to obtain comment hierarchy data, use ajax to achieve comment page interaction, here use thinkphp framework to do a simple demo exercise, in order to simplify the process here the third-level comments begin to stop replying, of course, as long as you make a little modification on this basis, you can achieve unlimited reply function, mainly because the view layer style modification is more troublesome and takes some time.

First, effect requirement analysis:

1. First-level comments can be posted directly in the head, and the latest comments are displayed at the top, as shown in the following effect picture

two。 You can reply to the comments posted, and the responses are displayed under the superior comments, forming a hierarchical relationship, as shown in the following effect picture

3. Page operation details: when you click the reply button for a comment, the reply text input box is displayed, while the reply text input box for other comments disappears, and when the reply button is clicked again, the text box disappears

4. Turn off the reply function at the last level of comment (here the setting is the third level)

5. Instantly display the total number of comments

Second, the implementation ideas and details

1. Data table design

Key functions of the 2.controller layer:

(1)。 Recursively get a list of comments

/ * Recursive get the list of comments * / protected function getCommlist ($parent_id = 0penalty comments result = array ()) {$arr = M ('comment')-> where ("parent_id ='". $parent_id. "'")-> order ("create_time desc")-> select (); if (empty ($arr)) {return array ();} foreach ($arr as $cm) {$thisArr=&$result []; $cm ["children"] = $this- > getCommlist ($cm ["id"], $thisArr) $thisArr = $cm;} return $result;}

(2)。 Show the action of the comments page

Public function index () {$num = M ('comment')-> count (); / / get the total number of comments $this- > assign (' num',$num); $data=array (); $data=$this- > getCommlist (); / / get the comment list $this- > assign ("commlist", $data); $this- > display ('index');}

(3)。 The comments page ajax accesses the action where the comments were added

/ * add comments * / public function addComment () {$data=array (); if ((isset ($_ POST ["comment"])) & & (! empty ($_ POST ["comment"])) {$cm = json_decode ($_ POST ["comment"], true); / / through the second parameter true, convert the json string into a key-value pair array $cm ['create_time'] = date (' Y-m-d _ POST ["comment"]) $newcm = M ('comment'); $id = $newcm- > add ($cm); $cm ["id"] = $id; $data = $cm; $num = M (' comment')-> count (); / / Total Statistical comments $data ['num'] = $num;} else {$data ["error"] = "0";} echo json_encode ($data);}

3.view layer implementation

(1)。 The overall structure design of the display page

Actual effect:

Page html code:

Php unlimited level classification actual combat-comment and reply function

{$num} comments

Comment

Full review

{$data.nickname} {$data.create_time}

{$data.content}

Reply

{$child.nickname} {$child.create_time}

{$child.content}

Reply

{$grandson.nickname} {$grandson.create_time}

{$grandson.content}

(2)。 Single comment information p structure code

{$data.nickname} {$data.create_time}

{$data.content}

Reply

The corresponding effect image:

Corresponding css code:

.head-pic {width:40px; height:40px;}. Cm {position:relative; top:0px; left:40px; top:-40px; width:600px;}. Cm-header {padding-left:5px;}. Cm-content {padding-left:5px;}. Cm-footer {padding-bottom:15px; text-align:right; border-bottom: 1px dotted # CCC;}. Comment-reply {text-decoration:none; color:gray; font-size: 14px;}

4. JS code

(1)。 Submit comments: the a tag button for submitting comments references the style comment-submit and performs the ajax operation in its click event

$('body') .delegate (' .comment-submit','click',function () {var content = $.trim ($(this). Parent (). Prev (). Children ("textarea"). Val ()); / / get the current comment content $(this). Parent (). Prev (). Children ("textarea"). Val ("") / / clear the input box if ("" = = content) {alert ("comment content cannot be empty!");} else {var cmdata = new Object (); cmdata.parent_id = $(this) .attr ("parent_id"); / / superior comment id cmdata.content = content; cmdata.nickname = "tourist"; / / Test data cmdata.head_pic = "/ Public/images/default.jpg" / / data for testing var replyswitch = $(this) .attr ("replyswitch"); / / get reply switch lock attribute $.ajax ({type: "POST", url: "/ index.php/home/index/addComment", data: {comment:JSON.stringify (cmdata)}, dataType: "json", success:function (data) {if (typeof (data.error) = = "undefined") {$(".comment-reply"). Next (). Remove () / / delete all existing responses p / / update the total number of comments $(".comment-num"). Children ("span") .html (data.num+ "comments"); / / display new comments var newli = ""; if (cmdata.parent_id = = "0") {/ / when it is a first-level comment, add it to the first-level ul list newli = "

"+ data.nickname+"+ data.create_time+"

"+ data.content+"

Reply

"; $(" .comment-ul ") .prepend (newli);} else {/ / otherwise added to the corresponding child's ul list if ('off'==replyswitch) {/ / verify that the reply lock exists, that is, the third-level comment no longer provides the reply function newli ="

"+ data.nickname+"+ data.create_time+"

"+ data.content+"

";} else {/ / reply button for secondary comments to add reply turn off lock attribute newli ="

"+ data.nickname+"+ data.create_time+"

"+ data.content+"

Reply

";} $(" Li [comment _ id=' "+ data.parent_id+"'] ") .children (" ul ") .prepend (newli);} else {/ / error message alert (data.error);});}})

(2)。 Reply to comments: the a tag button to reply to comments refers to the style comment-reply to show or hide the comment input box in its click event.

/ Click the "reply" button to show or hide the reply input box $("body"). Delegate (".comment-reply", "click", function () {if ($(this). Next () > 0) {/ / determine that reply p already exists and remove $(this). Next (). Remove ();} else {/ / add reply p $(".comment-reply"). Next (). Remove () / / delete all existing replies p / / add the current reply p var parent_id = $(this) .attr ("comment_id"); / / comment to reply id var phtml = ""; if ('off'==$ (this) .attr ("replyswitch")) {/ / after the second-level comment reply, the third-level comment no longer provides reply function, attach the close attribute to the "submit reply" button "phtml ="

Submit a reply

";} else {phtml ="

Submit a reply

";} $(this) .after (phtml);}})

At this point, the study on "how to use php to achieve comment reply function" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

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.