Question

嘿，我是一个新的程序员，开始使用RoR，HTML，CSS和JS遇到了一个问题，我不确定如何修复，搜索网络并且找不到答案所以这里是

我有一个日期选择器和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>

任何帮助将不胜感激

继承红宝石代码。

控制器

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

和视图中的继承人

<% @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

刷新，因为在处理程序中您有window.location.href = ...，这意味着它会更改浏览器的当前网址，并删除其中的所有网址。

<强>更新

您必须将处理程序中的endDate，startDate和hotel_id值分配给变量，并向页面添加提交按钮。单击提交按钮时，您可以更改包含参数的window.location.href。

如何使jquery堆栈/一起工作

1 个答案: