diff --git a/www/plan/plan.js b/www/plan/plan.js
index c674aa2..6288b4d 100644
--- a/www/plan/plan.js
+++ b/www/plan/plan.js
@@ -114,9 +114,10 @@ class Store {
 
         if(state === "shopping"){
             this.state = "shopping";
+            this.selector.find('.checkItems').show().animate({ width: '14px', 'margin-right': '5px' }, animTime);
         }
         if(state !== "shopping"){
-
+            this.selector.find('.checkItems').animate({ width: '0', 'margin-right': '0' }, animTime, function(){ $(this).hide(); });
         }
 
         if(state === "closed"){
@@ -212,6 +213,7 @@ class Store {
 
             let html = "\n";
             html += "<li class='list-group-item draggable"+(checked?' checkedItem':'')+"' id='item_"+itemID+"' data-itemid='"+itemID+"' draggable='true'>";
+            html += "  <span style='float: left; display: none; margin-right: 5px;' class='checkItems'><input type='checkbox'"+(checked?" checked":"")+"></span>";
             html += "  <span style='float: left;'>"+text+"</span>";
 
             html += "  <div class='priceWrapper'><span class='price'>"+(price*amount).toFixed(2)+"</span>";
@@ -227,7 +229,8 @@ class Store {
             html += "      <button class='btn btn-outline-success itemAmountBtn' type='button'>+</button>";
             html += "    </div>";
             html += "    <div class='itemAmountText "+(amount <= 1?"oneItem":"")+"' "+(this.state !== "shopping" || !checked?"style='display: none;'":'')+">"; //
-            html += "      Amount: <span class='itemAmount' style='padding-left: 10px;'>"+amount+"</span>x <span class='price'>" + price.toFixed(2) + "</span>";
+            html += "      Amount: <span class='itemAmount' style='padding-left: 10px;'>"+amount+"</span>x ";
+            if(price !== 0) { html += "<span class='price'>" + price.toFixed(2) + "</span>"; }
             html += "    </div>";
             html += "  </span>";
 
@@ -235,6 +238,13 @@ class Store {
 
             this.selector.find("ul.storeItems").append(html);
             this.selector.find(".emptyList").hide();
+            this.selector.find('#item_'+itemID+' .checkItems input').off().on('click', ev => {
+                if(this.checkItem(itemID)){
+                    $(ev.currentTarget).prop('checked', true);
+                } else {
+                    $(ev.currentTarget).prop('checked', false);
+                }
+            });
             this.verify();
             return true;
         }
@@ -250,7 +260,19 @@ class Store {
         if(this.itemsObj[itemID].checked){
             newChecked = false;
         }
-        alert("Tries to "+(newChecked?"check":"uncheck")+" an item!");
+        ajaxReq({ plan: 'checkItem', storeID: this.storeID, itemID: itemID, checked: (newChecked?"1":"0") })
+            .done(json => {
+                console.log("Successfully "+(newChecked?"checked":"unchecked")+" item.");
+                this.itemsObj[itemID].checked = newChecked;
+
+                if(newChecked === true){
+                    this.selector.find('#item_'+itemID).addClass("checkedItem");
+                }
+                else {
+                    this.selector.find('#item_'+itemID).removeClass("checkedItem");
+                }
+            });
+        return newChecked;
     }
 
     remItem(itemID, price){