javascript - 从选择输入动态更新列表

Question

在我的页面上，我有一个输入数据库的所有报价的列表。我希望能够从下拉框中选择一个用户，以便一旦选择该用户，报价列表就会更新，以便仅显示该用户所做的报价。

我遇到的问题是我不太熟悉 JavaScript，我相信这是大多数人解决这个问题的方法。我已经有了根据用户更新列表的代码，我只是不明白如何使用 JavaScript 动态更新列表。

我的代码的简要概述:

Controller

if quoted_by = "all"
  # Show every quote
else
  # Show quotes only made by user
end

HTML

<span id="msQuotedBy">
    <b>Filter by Initials: </b>
    <%= select(:msQuotedBy, :select, ['all'] + @initials.collect {|p| [p, p]}, {:selected => @quoted_by}) %>
</span>

JavaScript，现在我的 JavaScript 使用以下代码动态更新页面上的日历就可以了，但是我应该怎么做才能更新报价列表？

$('#msQuotedBy_select').change ->
    $('#msCalendar').fullCalendar('rerenderEvents')

Controller 显然是不对的，但这就是我头脑中的逻辑。如何使用 ('#msQuotedBy_select') 值像更新日历一样更新列表？

Answer 1

我可能会使用 AJAX 调用 Controller 中的特定操作，在该操作中检索用户的报价列表，并使用 .js.erb 文件进行响应。在此文件中执行以下操作:

<% html_content = j render(partial: 'a_partial_with_the_quotes', locals: { quotes: @user_quotes }) %>
$('#yourListOfQuotesContainer').html("<%= html_content %>);

或者类似的东西(我没有测试过，代码中可能有错误，但这是一般的想法)