AIMMOTH: Create Reddit Upvote with JSP, JQuery, AJAX and Google App Engine

2012-10-05

Create Reddit Upvote with JSP, JQuery, AJAX and Google App Engine

Finally used my Google-fu to create "post without reloading" on a styled div-tag with "no select on click" and "no line break".

 <html>  
  <head>  
   <meta http-equiv="content-type" content="text/html; charset=UTF-8">  
   <title>Hello App Engine</title>  
     <style type="text/css">  
         div {  
             -webkit-touch-callout: none;  
             -webkit-user-select: none;  
             -khtml-user-select: none;  
             -moz-user-select: none;  
             -ms-user-select: none;  
             user-select: none;  
             display: inline-block; 
         }  
         .div-up {  
             height: 10px;  
             width: 10px;  
             background-color: red;  
         }  
         .div-none {  
             height: 10px;  
             width: 10px;  
             background-color: gray;  
         }  
         .div-down {  
             height: 10px;  
             width: 10px;  
             background-color: black;  
         }  
     </style>  
  </head>  
  <body>  
     <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>  
     <script type="text/javascript">  
         function vote(d) {  
             var value = d.getAttribute("vote");  
             if (value == null || value == "down") {  
                 value = "up";  
                 d.setAttribute("class", "div-up");  
             } else if (value == "up") {  
                 value = "down";  
                 d.setAttribute("class", "div-down");  
             }  
             d.setAttribute("vote", value);  
             var v = "a_vote=" + value;  
             $.ajax({type: "POST", url: "/vote", data: v});  
         }  
     </script>  
     some<div class="div-none" onclick=vote(this);></div>text
  </body>  
 </html>

AIMMOTH

2012-10-05

Create Reddit Upvote with JSP, JQuery, AJAX and Google App Engine

Inga kommentarer:

Skicka en kommentar