sx-fc/app/views/inventory/stock_checks/backup_index.html.erb

<div class="page-header">
 <ol class="breadcrumb">
  <li class="breadcrumb-item"><a href="<%= root_path %>"><%= t("views.right_panel.button.home") %></a></li>
  <li class="breadcrumb-item active"><%= t("views.right_panel.detail.stock_check") %></li>
  <span class="float-right">
    <%= link_to t('.back', :default => t("views.btn.back")), inventory_path %>
  </span>
</ol>
</div>


<div class="row">
  <div class="col-xs-12 col-sm-12 col-md-9 col-lg-9">
    <!-- <div class="m-b-10 clearfix">
      <%= link_to t("views.btn.new"),new_settings_account_path,:class => 'btn btn-primary btn-lg float-right waves-effect"' %>
    </div -->
    <div class="card">
      <div class="p-l-15 p-r-15 p-t-10">
        <div class="row">
          <div class="col-md-6">
                <div class="form-group">
                  <div class="col-lg-10 col-md-10 col-sm-8 col-xs-7">
                        <!-- <label for="remark">Remark</label> -->
                         <input type='text' id='stock_check_reason' class='form-control' placeholder="Set Stock Check Reason" value=''/>
                  </div>
                </div>
                <div class="form-group">
                  <div class="col-lg-10 col-md-10 col-sm-8 col-xs-7">
                     <!-- <label for="password_2">Item</label> -->
                        <select class='form-control' id='product_sku'>
                          <option value="">Select Product</option>
                          <% @inventory_definitions.each do |id| %>
                          <option value="<%= id.item_code %>">
                            <% menu_item = MenuItemInstance.find_by_item_instance_code(id.item_code) %>
                            <% if menu_item.nil? %>
                            <%= Product.find_by_item_code(id.item_code).name rescue "-" %>
                            <% else %>
                            <%= menu_item.menu_item.name rescue '-' %> - <%= menu_item.item_instance_name rescue '-' %>
                            <% end %>
                          </option>
                          <% end %>
                        </select>
                  </div>
                </div>
                <div class="form-group">
                  <div class="col-lg-10 col-md-10 col-sm-8 col-xs-7">
                    <!-- <label for="email_address_2">Qty</label> -->
                        <input type='text' class='form-control' placeholder="Qty" id='product_qty' value=''/>
                  </div>
                </div>
                
                <div class="form-group">
                  <div class="col-md-4">
                     <button class="btn btn-primary form-control" id='save_to_stock_check'> Save</button>
                  </div>
                </div>
          </div>

          <div class="col-md-6">
            <table class="table table-striped" id='stock_item'>
              <tr>
                <!--<th>#</th>-->
                <th><%= t("views.right_panel.detail.product") %></th>
                <th><%= t("views.right_panel.detail.balance") %></th>
                <th><button class="btn btn-primary pull-right form-control" style='margin-bottom:2px;' id='finish'> <%= t("views.btn.finish") %></button></th>
              </tr>
              <!-- <tr>
                <td colspan="3">
                  <button class="btn btn-primary pull-right form-control" style='margin-bottom:2px;' id='finish'> Finish</button></td>
                </tr> -->
              </table>
          </div>
          
        </div>
      </div>
    </div>
  </div>
  <div class="col-xs-12 col-sm-12 col-md-3 col-lg-3">
    <div class="card">
      <div class="body">
        <h5><i class="material-icons md-18">view_headline <%= t("views.right_panel.header.page_detail") %></i> </h5>
        <p>
        1) <%= t("views.right_panel.detail.set_stock_check_reason") %> - <%= t("views.right_panel.detail.write_txt") %> <%= t("views.right_panel.detail.stock_check_reason_txt") %> <br>
        2) <%= t("views.right_panel.detail.select") +" "+ t("views.right_panel.detail.product")  %> - <%= t("views.right_panel.detail.select_txt") %> <%= t("views.right_panel.detail.product_txt") %> <br>
        3) <%= t("views.right_panel.detail.qty") %> - <%= t("views.right_panel.detail.write_txt") %> <%= t("views.right_panel.detail.qty_txt") %> <br>
        </p>
        <h5><i class="material-icons md-18">list <%= t("views.right_panel.header.button_lists") %></i> </h5>
        <p>
        1) <%= t("views.btn.save") %> - <%= t("views.right_panel.detail.create_btn_txt") %> <%= t("views.right_panel.detail.stock_check_txt") %> <br>
        2) <%= t("views.btn.finish") %> - <%= t("views.right_panel.detail.back_txt") %> <%= t("views.right_panel.detail.stock_check_txt") +" "+ t("views.right_panel.detail.detail_txt") %> <br>
        </p>
        
        <h5><i class="material-icons md-18">list <%= t("views.right_panel.header.link_lists") %></i> </h5>
        <p>
          1) <%= t("views.right_panel.button.home") %> - <%= t("views.right_panel.detail.home_txt") %> <br>
          2) <%= t("views.right_panel.button.back") %> - <%= t("views.right_panel.detail.back_txt") %> <%= t("views.right_panel.detail.home_txt") %> <br>
        </p>
      </div>
    </div>  
  </div>
</div>

<script>
    var count = 0;
    $(document).ready(function(){
      clearFormData();
    });
    
    function clearFormData(){
      $('#stock_check_reason').val("");
      $('#product_qty').val("");
      $('#product_sku').val("");
    }

    $('#save_to_stock_check').on('click', function () {
        count += 1;
        product_sku = $('#product_sku').val();
        product_qty = $('#product_qty').val();
        product_name = $("#product_sku").find("option:selected").text();

        // clearFormData();

        var tr = '<tr>'
            //+ '<td>' + count + '</td>'
            + '<td><input type=hidden value="' + product_sku + '" id="item_sku_' + count + '" name=' + count + '/>'
            + product_name + '</td>'
            + '<td><input type=text value="' + product_qty + '" class="form-control col-md-9" id="item_qty_' + count + '" name=' + count + '/></td>'
            + '<td><input type=button value="X" class="btn btn-danger p-l-15 p-r-15" id="item_remove_' + count + '" name=' + count + ' onclick="remove_row('+ count +')"/></td>'
            + '</tr>';
        $('#stock_item').append(tr);
//        $('#product_sku').val('');
        $('#product_qty').val('');
    });

    $('#finish').on('click', function () {
        var reason = $('#stock_check_reason').val();
        var arr = [];
        var jsonStr = '';

        for (var i = 1; i <= count; i++) {
            itemname = $('#item_sku_' + i).val();
            itemqty = $('#item_qty_' + i).val();
            if(itemname !== undefined){
                arr.push({sku: itemname, qty: itemqty});
            }
            jsonStr = JSON.stringify(arr);
        }
        console.log(jsonStr);
        $.ajax({
            type: 'Post',
            url: '<%= inventory_stock_check_save_path %>',
            data: 'stock_item=' + jsonStr + '&reason=' + reason,
            success: function (data) {
                window.location.href = '/inventory/stock_checks/' + data['stock_id'];
            }
        })
    });

    function remove_row(row) {
        $("#item_remove_"+row).parent().parent().remove();
    }

</script>