jqueryのスタック/ワークの作り方

Question

こんにちは、私はRoR、HTML、CSS、JSを使い始めた新しいプログラマーです。JSは、修正する方法がわからない、Webを検索して、ここで答えを見つけてください。

私は日付ピッカーと2つのドロップダウンメニューを持っていますが、何かを選択するたびに、一緒に働くことはできません。コードは次のようになります。

 <script type="text/javascript"> 
         $(function() { 
          function cb(start, end) { 
           $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY')); 

          } 
          cb(moment(), moment()); 

          $('#reportrange').daterangepicker({ 
           ranges: { 
            'Today': [moment(), moment()], 
            'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')], 
            'Last 7 Days': [moment().subtract(6, 'days'), moment()], 
            'Last 30 Days': [moment().subtract(29, 'days'), moment()], 
            'This Month': [moment().startOf('month'), moment().endOf('month')], 
            'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month')], 
            'This Year': [moment().startOf('year'), moment()] 
           } 
          }, cb); 



          $('#reportrange').on('apply.daterangepicker', function(ev, picker) { 
           //do something, like clearing an input 
           data = { 
            startDate: picker.startDate.format(), 
            endDate: picker.endDate.format() 
           } 


           window.location.href = "/invoices?startDate=" + data["startDate"] + "&endDate=" + data["endDate"] 
          }); 
         }); 
         </script> 
<script type="text/javascript"> 
        $(function(){ 
         $(".dropdown-menu li a").click(function(){ 
           choice = $(this).text() 

           if(choice == "Normal"){ 
            $("tr.false").show() 
            $("tr.true").hide() 
           }else if(choice == "Special"){ 
             $("tr.false").hide() 
             $("tr.true").show() 
           }else if(choice == "Pudu"){ 
             $("tr[data-id='2']").hide() 
             $("tr[data-id='1']").show() 
             window.location.href = "/invoices?hotel_id=" + 1 
           }else if(choice == "Kota"){ 
             $("tr[data-id='1']").hide() 
             $("tr[data-id='2']").show() 
             window.location.href = "/invoices?hotel_id=" + 2 
           }else if(choice == "All"){ 
             $("tr").show() 
           } 

           $(this).closest(".dropdown").find(".btn").text(choice) 


           console.log($(this)) 


         }); 
        }); 
       </script> 

すべてのヘルプはRubyのコードHERESに

を理解されるであろう。ビュー

<% @invoices.each do |inv| %> 
    <tr class="<%= inv.special %> data-item" data-id ="<%= inv.hotel_id %>"> 
     <td><%= link_to inv.name, invoice_path(inv) %></td> 
     <td><%= inv.identification %></td> 
     <td><%= inv.room %></td> 
     <td><%= inv.rate * inv.days %></td> 
     <td class="col-md-1"><%= link_to "Edit", edit_invoice_path(inv)%></td> 
     <% if current_user.sk?%> 
     <td class="col-md-1"><%= link_to "Delete", inv, method: :delete, data: {confirm: 'Are you sure you want to delete this invoice?'} %></td> 
     <% end %> 
    </tr> 
    <% end %> 

Answer 1

リフレッシュ、中

コントローラ

def index 
@startDate = Date.parse(params[:startDate]) if params[:startDate] 
@endDate = Date.parse(params[:endDate]) if params[:endDate] 


@invoices = Invoice.all 


if params[:startDate] 
    @invoices = @invoices.where("created_at >= ?", @startDate).where("created_at <= ?", @endDate.tomorrow) 
else 
    @invoices = @invoices.where("created_at >= ?", Date.today) 
end 


if params[:hotel_id] 
    @invoices = @invoices.where(hotel_id: params[:hotel_id]) 
end 

と相続人のハンドラでは、あなたはwindow.location.href = ...を持っているので、それはあなたのブラウザの現在のURLの場所を変更することを意味し、すべての3を削除しますそれら。

更新：

あなたが変数にハンドラでendDate、startDateとhotel_id値を代入し、ページに送信ボタンを追加する必要があります。送信ボタンをクリックしている間に、パラメータを含むwindow.location.hrefを変更します。