在javascript中创建过滤器，以通过网址

Question

我觉得我真的很接近搞清楚这一点。我尝试了很多不同的方式。

• 我想为selects创建两个writing_type，为sort_by模型中的agreement创建另一个，以过滤结果。我想在index.html的JS文件中需要一个不同的代码，并且可能在我的控制器中进行编辑。

• 我找到了解决问题的方法，但我无法弄清楚我需要做的其余工作。

我认为我需要做什么：更改模型变量以接受params[:writing_type]和:sort_by？

的index.html

＆＃13;

＆＃13;

<form accept-charset="UTF-8" action="/scribe_requests" method="get">
  <input type='submit' value="go">

  <select id="querySelct" name="writing_type">
    <option value=":all" label="Writing Type">Writing Type</option>
    <option value="College Applications" label="College Applications">College Applications</option>
    <option value="College Essays" label="College Essays">College Essays</option>
    <option value="Business Papers" label="Business Papers">Business Papers</option>
    <option value="Resumes" label="Resumes">Resumes</option>
    <option value="High-School Essays" label="High-School Essays">High-School Essays</option>
    <option value="Scholarship Essays" label="Scholarship Essays">Scholarship Essays</option> 
    <option value="Language Translation" label="Language Translation">Language Translation</option>   
  </select>

  <select id="landingSelect" name= "sort_by">
    <option value="created_at desc" label="Sort By">Sort By</option>
    <option value="created_at desc" label="Due Date(closer)">Due Date(closer)</option>
    <option value="created_at asc" label="Due Date(further)">Due Date(further)</option>
  </select>

</form>

＆＃13;

＆＃13;

＆＃13;

控制器：

def index

      @agreements = Agreement.where("accepted = ?", false).where("due_date >= ?", DateTime.now).where("writing_type = ?", params[:writing_type]).order(params[:sort_by]).paginate(:page => params[:page], :per_page => 20)

 end

这是在index.html.erb中调用的部分内容

＆＃13;

＆＃13;

</div class="agreements-list">
		<%= render 'agreements/lists', agreements: @agreements %>
	    </div>

＆＃13;

＆＃13;

＆＃13;

模型协议包含我希望按其排序的列和我要过滤的writing_types。

因此，计划是使用网址，并根据网址更改网址将使用&writing_type=1，例如将其包含在网址的末尾。

如何将脚本URL添加到顶部的主URL并自行刷新？我可以在以后添加ajax !!除非你有ajax答案吗？非常感谢，这对我来说非常重要！谢谢！

Answer 1

我觉得你正在以一种非常艰难的方式做一些直截了当的事情。如果没有所有JS，你应该能够通过如下形式实现你想要的东西：

<form accept-charset="UTF-8" action="/agreements" method="get">
  <input type='submit' value="go">

  <select id="querySelct" name="writing_type">
    <option value="0" label="Writing Type">Writing Type</option>
    <option value="1" label="College Applications">College Applications</option>
    <option value="2" label="College Essays">College Essays</option>
    <option value="3" label="Business Papers">Business Papers</option>
    <option value="4" label="Resumes">Resumes</option>
    <option value="5" label="High-School Essays">High-School Essays</option>
    <option value="6" label="Scholarship Essays">Scholarship Essays</option> 
    <option value="6" label="Language Translation">Language Translation</option>   
  </select>

  <select id="landingSelect" name= "sort_by">
    <option value="0" label="Sort By">Sort By</option>
    <option value="1" label="Due Date(closer)">Due Date(closer)</option>
    <option value="2" label="Due Date(further)">Due Date(further)</option>
  </select>

</form>

通过将其放在一个表单中，其名称与选择相对应，它应该提交到表单路径（我猜这是对/agreements的get请求，它将路由到控制器中的索引操作），根据选择的选项填充参数

在您的索引操作中，您应该能够按params[:writing_type]和params[:sort_by]

获取参数

更新

要处理所有写入类型，请在索引控制器中以不同方式执行此操作，例如

if params[:writing_type] == "all" #or whatever option represents all
  @agreements = Agreement.all
else
  @agreements = Agreement.where(writing_type: params[:writing_type])
end