guestbook

app/index/controller/Index.php

@@ -69,29 +69,27 @@ class Index extends Base
         return View::fetch();
     }
     
-    public function saveGuestBook(Request $request = null)
+    public function saveGuestBook()
     {
-        $param = $request->param();
+        $param = $this->request->param('','',['strip_tags','htmlspecialchars']);
 
-        if (empty($param['author']) or empty($param['email'])) {
+        if (empty($param['name']) or empty($param['contact'])) {
             View::assign('data', ['msg'=>"请填写必填字段（姓名，电子邮件）", 'code'=>1]);
             return View::fetch('error');
         }
 
-        if (empty($param['comment'])) {
+        if (empty($param['content'])) {
             View::assign('data', ['msg'=>"请留下内容", 'code'=>1]);
 
             return View::fetch('error');
         }
 
-        array_pop($param);
-
         try {
             $bgu = new GuestBook();
-            $res = $bgu->save([
-                'comment' => $param['comment'],
-                'author' => $param['author'],
-                'email' => $param['email'],
+            $bgu->save([
+                'content' => $param['content'],
+                'name' => $param['name'],
+                'contact' => $param['contact'],
                 'url' => $param['url'],
                 'time' => time(),
             ]);

app/index/route/app.php

@@ -30,6 +30,8 @@ Route::get('/index', 'index/index/index');
 Route::get('/', 'index/index/index');
 Route::view('/404', '404');
 Route::get('/about', 'index/index/about')->append(['_aside' => true]);
+Route::get('/guest_book', 'index/index/guestBook');
+Route::post('/save_guest_book', 'index/index/saveGuestBook');
 
 Route::get('/tags/:name', 'index/article/tags');
 Route::get('/time-<page?>', 'index/article/time')->append(['_aside' => true]);

public/static/index/css/index.css

@@ -139,6 +139,21 @@ nav li:nth-child(n+4) { border-top: none }
 nav li:nth-child(2), nav li:nth-child(5), nav li:nth-child(8) { border-left: 1px solid #333; border-right: 1px solid #333; }
 .infosbox { width: 100% }
 }
+button.submit {
+    width: 100%;
+    font-family: "Roboto", "Open Sans", sans-serif;
+    font-weight: 400;
+    padding: 10px 12px;
+    max-width: 27.75em;
+    min-height: 26px;
+    background: #F7F7F7;
+    color: #333333;
+    border: solid 1px #D4D4D4;
+    border-radius: 0;
+    -webkit-appearance: none;
+    -webkit-transition: background 0.2s;
+    transition: background 0.2s;
+} 
 
 /*read*/
 .news_con h2 { font-size: 16px; width: auto; height: 30px; line-height: 30px; text-align: center; background: #333; color: #fff; margin: 10px 0; font-weight: normal;display:inline-block !important; display:inline;padding: 0px 20px;}

view/index/index/guest_book.html

@@ -1,105 +1,109 @@
 <style>
-  .comment-respond {
-  background: white;
-  box-shadow: 0 0 2px 0 rgba(58, 58, 58, 0.2);
-  padding: 1.5em 4.6875375%;
-}
-
-.guestbook {
-  width: 100%; 
-  float: left;
-  padding-bottom: 3em;
-}
-
-.guestbook h2 span {
-  font-size: 12px;
-}
-
-@media only screen and (max-width: 767px) {
   .comment-respond {
     background: white;
     box-shadow: 0 0 2px 0 rgba(58, 58, 58, 0.2);
-    padding: 1.5em 7.50006%;
-  }
-}
-
-h3 {
-  font-size: 1.125em;
-  /* 18px / 16px */
-  line-height: 1.333;
-  /* 24px */
-}
-.comment-respond p{
-  margin: 1.125em 0;
-}
-
-.comment-respond p.comment-notes {
-  margin: 1.5em 0;
-}
-
-.comment-respond label {
-  display: block;
-  margin-bottom: 6px;
-  font-weight: 700;
-  font-size: 0.875em;
-  line-height: 1.715;
-}
-
-input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="file"]):not([type="image"]), textarea {
-  width: 100%;
-  font-family: "Roboto", "Open Sans", sans-serif;
-  font-weight: 400;
-  padding: 10px 12px;
-  max-width: 27.75em;
-  min-height: 26px;
-  background: #F7F7F7;
-  color: #333333;
-  border: solid 1px #D4D4D4;
-  border-radius: 0;
-  -webkit-appearance: none;
-  -webkit-transition: background 0.2s;
-  transition: background 0.2s;
-}
-
-textarea {
-  max-width: 41.625em;
-  overflow: auto;
-}
-.comment-respond p.form-submit {
-  margin-top: 2.25em;
-}
-
-input[type="submit"]{
-  font-size: 0.75em;
-  line-height: 1.5;
-}
-
-input[type="submit"] {
-  font-family: "Roboto", "Open Sans", sans-serif;
-  font-weight: 400;
-  padding: 10px 12px;
-  color: #333333;
-  border: solid 1px #333333;
-  background: none;
-  border-radius: 0;
-  -webkit-appearance: none;
-  -webkit-transition: all 0.2s;
-  transition: all 0.2s;
-}
-
-.pager{
-  margin-left: 10%;
-  width: 60%;
-  background: red;
-}
-
-ul.pager li:first-child {
-  float: left;
-}
-ul.pager li:last-child{
-  float: left;
-  margin-left: 30%;
-}
+    padding: 1.5em 4.6875375%;
+  }
+
+  .guestbook {
+    width: 100%;
+    float: left;
+    padding-bottom: 3em;
+  }
+
+  .guestbook h2 span {
+    font-size: 12px;
+  }
+
+  @media only screen and (max-width: 767px) {
+    .comment-respond {
+      background: white;
+      box-shadow: 0 0 2px 0 rgba(58, 58, 58, 0.2);
+      padding: 1.5em 7.50006%;
+    }
+  }
+
+  h3 {
+    font-size: 1.125em;
+    /* 18px / 16px */
+    line-height: 1.333;
+    /* 24px */
+  }
+
+  .comment-respond p {
+    margin: 1.125em 0;
+  }
+
+  .comment-respond p.comment-notes {
+    margin: 1.5em 0;
+  }
+
+  .comment-respond label {
+    display: block;
+    margin-bottom: 6px;
+    font-weight: 700;
+    font-size: 0.875em;
+    line-height: 1.715;
+  }
+
+  input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="file"]):not([type="image"]),
+  textarea {
+    width: 100%;
+    font-family: "Roboto", "Open Sans", sans-serif;
+    font-weight: 400;
+    padding: 10px 12px;
+    max-width: 27.75em;
+    min-height: 26px;
+    background: #F7F7F7;
+    color: #333333;
+    border: solid 1px #D4D4D4;
+    border-radius: 0;
+    -webkit-appearance: none;
+    -webkit-transition: background 0.2s;
+    transition: background 0.2s;
+  }
+
+  textarea {
+    max-width: 41.625em;
+    overflow: auto;
+  }
+
+  .comment-respond p.form-submit {
+    margin-top: 2.25em;
+  }
+
+  input[type="submit"] {
+    font-size: 0.75em;
+    line-height: 1.5;
+  }
+
+  input[type="submit"] {
+    font-family: "Roboto", "Open Sans", sans-serif;
+    font-weight: 400;
+    padding: 10px 12px;
+    color: #333333;
+    border: solid 1px #333333;
+    background: none;
+    border-radius: 0;
+    -webkit-appearance: none;
+    -webkit-transition: all 0.2s;
+    transition: all 0.2s;
+  }
+
+  .pager {
+    margin-left: 10%;
+    width: 60%;
+    background: red;
+  }
+
+  ul.pager li:first-child {
+    float: left;
+  }
+
+  ul.pager li:last-child {
+    float: left;
+    margin-left: 30%;
+  }
 </style>
 
 <div class="box">
@@ -112,8 +116,9 @@ ul.pager li:last-child{
   <!-- #respond -->
   <div id="respond" class="comment-respond">
     <h3 id="reply-title" class="comment-reply-title">Leave a Reply</h3>
-    <form action="{:url('index/index/saveguestbook')}" method="post" id="commentform" class="comment-form" novalidate="">
-      <p class="comment-notes"><span id="email-notes">我会妥善保存你的邮箱哒(｀・ω・´).</span> 必填项已标记<span class="required">*</span></p>
+    <form action="{:url('/index/save_guest_book')}" method="post" id="commentform" class="comment-form" novalidate="">
+      <p class="comment-notes"><span id="email-notes">我会妥善保存你的邮箱哒(｀・ω・´).</span> 必填项已标记<span class="required">*</span>
+      </p>
       <p class="comment-form-comment">
         <label for="comment">Comment*</label>
         <textarea required="" id="content" name="content" cols="45" rows="8" aria-required="true"></textarea>
@@ -130,7 +135,8 @@ ul.pager li:last-child{
         <label for="url">url</label>
         <input id="url" name="url" type="text" placeholder="https://www.google.com" value="" size="26">
       </p>
-      <p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Post Comment">
+      <p class="form-submit">
+        <button type="button" id="submit" class="submit">Post Comment</button>
         <!-- <input type="hidden" name="comment_post_ID" value="23" id="comment_post_ID">
         <input type="hidden" name="comment_parent" id="comment_parent" value="0"> -->
       </p>
@@ -146,8 +152,23 @@ ul.pager li:last-child{
       <p>{$val.content}</p>
     </div>
     {/foreach}
-    <div class="pagelist">
-      {$list->render()}
-    </div>
+    {$list->render()}
   </div>
 </div>
+
+<script>
+  $("#submit").click(function () {
+    $.post('/index/save_guest_book', {
+      'name': $("#name").val(),
+      'content': $("#content").val(),
+      'contact': $("#contact").val(),
+      'url': $("#url").val(),
+    }, function (res) {
+      if (res.code == 1) {
+        console.log(res);
+      } else {
+        console.log(res);
+      }
+    }, 'json');
+  })
+</script>