Question

我有一个模型调用Post，和其他模型调用Category，其中1个帖子有多个类别。

在我的新帖子中，我的所有类别都是按钮，我选择了点击类别并更改按钮的类别。（显示按下按钮）

当我点击提交按钮时，如何知道用户是否点击了任何类别？没有javascript / ajax就可以做到这一点。

我想在保存帖子之前进行此检查

这是我的类别按钮

  .row-fluid
    .field
      = f.label :category
      - @categories.each do |cate|
        = button_tag(:class=> 'categoryButton', :type =>'button', :value=> cate.id) do
          = content_tag(:strong, cate.name)

  .row-fluid
    .actions.pull-right
      = f.submit t(:save)


:javascript
  $(document).ready(function(){
  $('.categoryButton').click(function(){
    if (this.className == "categoryButtonCambiado")
      this.className=this.className ="categoryButton"
    else
      this.className=this.className ="categoryButtonCambiado"
  });
  })

任何想法！

Answer 1

您应该将其实现为复选框而不是按钮，这对于实现和用户习惯来说更自然。

如果你真的想使用一个按钮，你仍然可以添加复选框，隐藏它们（使用hidden类，因为你好像在使用bootstrap），并使用javascript检查/取消选中它们：

  .row-fluid
    .field
      = f.label :category
      - @categories.each do |cate|
        = check_box_tag "categories[#{cate.id}]", '1', false, class: 'hidden'
        = button_tag(:class=> 'categoryButton', :type =>'button', :value=> cate.id) do
          = content_tag(:strong, cate.name)

  .row-fluid
    .actions.pull-right
      = f.submit t(:save)


:javascript
  $(document).ready(function(){
  $('.categoryButton').click(function(){
    if (this.className == "categoryButtonCambiado")
      this.className=this.className ="categoryButton"
      $(this).prop( 'checked', true );
    else
      this.className=this.className ="categoryButtonCambiado"
      $(this).prop( 'checked', false );
  });
  })

然后，您可以在控制器中检索已检查的类别ID：

params[:categories]

顺便说一句，这是偏离主题的，但你应该考虑将你的javascript放在专用文件中，使用rails资产管道非常容易。

保存前检查帖子的类别

1 个答案: