diff --git a/app/views/origami/addorders/detail.html.erb b/app/views/origami/addorders/detail.html.erb
index cb849a01..440009e1 100755
--- a/app/views/origami/addorders/detail.html.erb
+++ b/app/views/origami/addorders/detail.html.erb
@@ -73,9 +73,10 @@
                <div class="col-md-6 ">
                  <strong id="order-title" class="font-14">ORDER DETAILS </strong>
                </div>
-               <!-- <div class="col-md-3">Table -</div>  -->
-               <div class="col-md-6">
-               <a class="btn btn-block bg-blue waves-effect" data-toggle="modal" data-target="#TableModal">Select Table</a>
+               <div class="col-md-3">Select</div> 
+               <div class="col-md-3 m-t--5">
+               <a class="btn btn-block bg-blue waves-effect select_table" data-toggle="modal" data-target="#TableModal"> Select </a>
+               <input type="hidden" name="table_id" value="" id="table_id">
                 </div>
             </div>
           <% else %>
@@ -337,9 +338,9 @@
                 <% if table.status == 'occupied' %>
                   <% if table.get_booking.nil? %>
                     <% if table.get_checkout_booking.nil? %>
-                      <div class="card tables red text-white table_<%= table.id %>" data-id="<%= table.id %>" style="margin-bottom: .5rem;">
+                      <div class="card tables red text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
                     <% else %>                            
-                      <div class="card tables orange text-white table_<%= table.id %>" data-id="<%= table.id %>" style="margin-bottom: .5rem;">
+                      <div class="card tables orange text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
                     <% end %>                         
                       <div class="card-block">
                         <%= table.name %>
@@ -349,9 +350,9 @@
                       </div>
                   <% else %>         
                     <% if table.get_checkout_booking.nil? %>
-                       <div class="card tables blue text-white table_<%= table.id %>" data-id="<%= table.id %>" style="margin-bottom: .5rem;">
+                       <div class="card tables blue text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
                     <% else %>                       
-                      <div class="card tables orange text-white table_<%= table.id %>" data-id="<%= table.id %>" style="margin-bottom: .5rem;">
+                      <div class="card tables orange text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
                     <% end %>                   
                       <div class="card-block">
                         <%= table.name %>
@@ -360,7 +361,7 @@
                     </div>
                   <% end %>
                   <% else %>
-                      <div class="card tables green text-white table_<%= table.id %>" data-id="<%= table.id %>" style="margin-bottom: .5rem;">
+                      <div class="card tables green text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
                       <div class="card-block">
                         <%= table.name %>
                         <span class="float-right font-12 new_text_<%= table.id %> hide"> new</span>
@@ -376,9 +377,9 @@
                     <% if table.status == 'occupied' %>
                       <% if table.get_booking.nil? %>
                         <% if table.get_checkout_booking.nil? %>
-                          <div class="card tables red text-white table_<%= table.id %>" data-id="<%= table.id %>" style="margin-bottom: .5rem;">
+                          <div class="card tables red text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
                         <% else %>                            
-                          <div class="card tables orange text-white table_<%= table.id %>" data-id="<%= table.id %>" style="margin-bottom: .5rem;">
+                          <div class="card tables orange text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
                         <% end %>                         
                           <div class="card-block">
                             <%= table.name %>
@@ -388,9 +389,9 @@
                           </div>
                       <% else %>         
                         <% if table.get_checkout_booking.nil? %>
-                           <div class="card tables blue text-white table_<%= table.id %>" data-id="<%= table.id %>" style="margin-bottom: .5rem;">
+                           <div class="card tables blue text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
                         <% else %>                       
-                          <div class="card tables orange text-white table_<%= table.id %>" data-id="<%= table.id %>" style="margin-bottom: .5rem;">
+                          <div class="card tables orange text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
                         <% end %>                   
                           <div class="card-block">
                             <%= table.name %>
@@ -399,7 +400,7 @@
                         </div>
                       <% end %>
                       <% else %>
-                          <div class="card tables green text-white table_<%= table.id %>" data-id="<%= table.id %>" style="margin-bottom: .5rem;">
+                          <div class="card tables green text-white table_<%= table.id %>" data-id="<%= table.id %>" data-name="<%= table.name %>" style="margin-bottom: .5rem;">
                           <div class="card-block">
                             <%= table.name %>
                             <span class="float-right font-12 new_text_<%= table.id %> hide"> new</span>
@@ -412,8 +413,31 @@
           <div class="modal-footer  p-r-30">
             <button type="button" class="btn btn-link btn-danger waves-effect" data-dismiss="modal">CLOSE</button>
             &nbsp;  &nbsp;
-            <button type="button" class="btn btn-link bg-blue waves-effect choose_payment">SAVE</button>
+            <button type="button" class="btn btn-link bg-blue waves-effect confirm_table" data-dismiss="modal">Confirm</button>
           </div>
         </div>
       </div>
     </div>
+<script>
+  cashier_type = "cashier"
+    $(document).ready(function () {
+    $(".tables").on('click', function () {
+        $('.tables').css('background-color','');
+        $('.tables').removeClass('purple')
+        var dining_id = $(this).attr("data-id");
+        var name = $(this).attr("data-name");
+        $(this).css('background-color','purple');
+        $(this).addClass('purple')
+        $('.confirm_table').attr("data-id",dining_id)
+        $('.confirm_table').attr("data-name",name)
+
+    });
+    $(".confirm_table").on('click', function () {
+        var dining_id = $(this).attr("data-id");
+        var name      = $(this).attr("data-name");
+        $('#table_id').val(dining_id)
+        $('.select_table').text(name)
+
+    });
+  });
+</script>
\ No newline at end of file