* comments:

* show error if ajax req failed
  * use .serialize() instead manual form packing

public/theme/js/main.js

@@ -18,21 +18,15 @@ $(document).ready(function() {
     $('a#cadd').click(function(e) {
       e.preventDefault();
       $(this).remove();
-      $('#comments').load('/comments/new', function() {
+      $('div#cadd').load('/comments/new', function() {
         // form submit with ajax
         $('#comments form').submit(function(e) {
           e.preventDefault();
-          var url = document.createElement('a');
-          url.href = window.location;
-          var text = $('#comments textarea').val();
-          $.post('/comments/add', {
-            'pageid': escape(url.pathname),
-            'text':   text,
-          }, function() {
-            location.reload();
-          });
+          $.post('/comments/add', $(this).serialize())
+            .done(function(data) { location.reload(); })
+            .fail(function(data) { $('#comments #resp').val(data); });
         }); // form submit
       }); // on form load
     }); // #cadd click
-  }); // #comments
+  }); // #comments load
 }); // document ready

templates/comments/list.html.ep

@@ -13,4 +13,6 @@
   </div>
 </div>
 % }
-<p><a href="#" id="cadd"><%= l('Add') %></a></p>
+<div id="cadd">
+  <a href="#" id="cadd"><%= l('Add') %></a>
+</div>

templates/comments/new.html.ep

@@ -1,8 +1,9 @@
 % my $pageid = stash('pageid') || '';
 <form method="POST" action="/comments/add" id="cadd">
+  <input type="hidden" value="<%= $pageid %>" name="pageid">
   <hr/>
   <textarea></textarea>
   <br/>
   <input type="submit" value="<%= l('Add') %>">
-  <input type="hidden" value="<%= $pageid %>" name="pageid">
+  <span id="resp" style="color: red"></span>
 </form>