Rails 通过 jQuery Draggable Droppable 和 hide_field_tag 更新 has_many

发布于 2024-11-18 10:50:50 字数 3544 浏览 3 评论 0原文

我正在制作一个屏幕,人们可以通过将图像从图库拖到托盘中来“投票”彼此最喜欢的图像。我使用 jQuery 来实现可拖动/可放置。当用户将图像从图库拖到托盘时,我想更新我的 has_many :through 数据库中的关系(假期投票)。我正在尝试使用hidden_​​field_tag来保存选票。

提交表单时我没有收到传递的参数。有人知道如何做到这一点吗?提前致谢!

模型

假期

class Vacation < ActiveRecord::Base
  belongs_to :user
  belongs_to :period
  has_many :votes
  has_many :images, :through => :votes
  accepts_nested_attributes_for :votes

  attr_accessible :user_id, :period_id, :name
end

投票

class Vote < ActiveRecord::Base
  belongs_to :vacation
  belongs_to :image

  attr_accessible :image_id, :vacation_id
end

图像

class Image < ActiveRecord::Base
  belongs_to :user
  belongs_to :category
  has_many :votes
  has_many :vacations, :through => :votes

  attr_accessible :user_id, :title, :facebook_id, :image

  validates_presence_of :user_id;
  validates_presence_of :title;
  validates_presence_of :image;

  validates_length_of :title, :maximum => 255

  mount_uploader :image, ImageUploader
end

Javascript

    var $gallery = $( "#gallery" ),
        $tray = $( "#tray_images" );

    $( "li", $gallery ).draggable({
      cancel: "a.ui-icon", 
      revert: "invalid", 
      cursor: "move",
      helper: "clone"
    });

    $tray.droppable({
      accept: "#gallery > li",
      drop: function( event, ui ) {
        moveImageToTray( ui.draggable );
        $( "#update_vacation" ).submit();
      }
    });

    function moveImageToTray( $item ) {
      $item.fadeOut(function() {
        $tray.append($item);
        $item.fadeIn();
      });
    }

视图 /vacations/show.html.erb

<%= form_for @vacation, :html => { :method => :put, :id => "update_vacation" } do |f| %>
  <%= hidden_field_tag :user_id, @vacation.user_id %>
  <%= hidden_field_tag :period_id, @vacation.period_id %>
  <%= hidden_field_tag :name, @vacation.name %>

  <div id="tray" class="grid_19 push_1 alpha">
    <ul id="tray_images" class="gallery">
      <% @votes.each do |vote| %>
        <li class="grid_3 image">
          <% link_to @images_all[i] do %>
            <% content_tag :div do %>
              <%= image_tag @images_all[i].image_url(:thumb_100_100) %>
              <%= hidden_field_tag "vacation[][image_ids]", vote.image_id %>
            <% end %>
          <% end %>
        </li>
      <% end %>
    </ul>
  </div>
<% end %>

<div class="clear"></div>  

<div class="grid_24">
<ul id="gallery" class="grid_19 push_1 alpha gallery">
  <% @images_all.each do |image| %>
      <li class="grid_3 image">
        <% link_to image do %>
          <% content_tag :div do %>
            <%= image_tag image.image_url(:thumb_100_100) %>
            <%= hidden_field_tag "vacation[image_ids][]", image.id %>
          <% end %>
        <% end %>
      </li>
    <% end %>
  <% end %>
</ul>

控制器

  def update
    params[:vacation][:votes] ||= []
    break

    @vacation = Vacation.find(params[:id])
    if @vacation.update_attributes(params[:vacation])
      redirect_to @vacation, :notice  => "Successfully updated vacation."
    else
      render :action => 'edit'
    end
  end

I am making a screen where people "vote" for each other's favorite images by dragging them from a gallery into a tray. I am using jQuery for the draggable / droppable. When the user drags an image from the gallery to the tray, I want to update my has_many :through relationship in the database (the vacation votes). I am trying to use hidden_field_tag to hold the votes.

I am not getting parameters passed when the form submits. Anyone have an idea on how to do this? Thanks in advance!

The Models

Vacation

class Vacation < ActiveRecord::Base
  belongs_to :user
  belongs_to :period
  has_many :votes
  has_many :images, :through => :votes
  accepts_nested_attributes_for :votes

  attr_accessible :user_id, :period_id, :name
end

Vote

class Vote < ActiveRecord::Base
  belongs_to :vacation
  belongs_to :image

  attr_accessible :image_id, :vacation_id
end

Image

class Image < ActiveRecord::Base
  belongs_to :user
  belongs_to :category
  has_many :votes
  has_many :vacations, :through => :votes

  attr_accessible :user_id, :title, :facebook_id, :image

  validates_presence_of :user_id;
  validates_presence_of :title;
  validates_presence_of :image;

  validates_length_of :title, :maximum => 255

  mount_uploader :image, ImageUploader
end

The Javascript

    var $gallery = $( "#gallery" ),
        $tray = $( "#tray_images" );

    $( "li", $gallery ).draggable({
      cancel: "a.ui-icon", 
      revert: "invalid", 
      cursor: "move",
      helper: "clone"
    });

    $tray.droppable({
      accept: "#gallery > li",
      drop: function( event, ui ) {
        moveImageToTray( ui.draggable );
        $( "#update_vacation" ).submit();
      }
    });

    function moveImageToTray( $item ) {
      $item.fadeOut(function() {
        $tray.append($item);
        $item.fadeIn();
      });
    }

The View /vacations/show.html.erb

<%= form_for @vacation, :html => { :method => :put, :id => "update_vacation" } do |f| %>
  <%= hidden_field_tag :user_id, @vacation.user_id %>
  <%= hidden_field_tag :period_id, @vacation.period_id %>
  <%= hidden_field_tag :name, @vacation.name %>

  <div id="tray" class="grid_19 push_1 alpha">
    <ul id="tray_images" class="gallery">
      <% @votes.each do |vote| %>
        <li class="grid_3 image">
          <% link_to @images_all[i] do %>
            <% content_tag :div do %>
              <%= image_tag @images_all[i].image_url(:thumb_100_100) %>
              <%= hidden_field_tag "vacation[][image_ids]", vote.image_id %>
            <% end %>
          <% end %>
        </li>
      <% end %>
    </ul>
  </div>
<% end %>

<div class="clear"></div>  

<div class="grid_24">
<ul id="gallery" class="grid_19 push_1 alpha gallery">
  <% @images_all.each do |image| %>
      <li class="grid_3 image">
        <% link_to image do %>
          <% content_tag :div do %>
            <%= image_tag image.image_url(:thumb_100_100) %>
            <%= hidden_field_tag "vacation[image_ids][]", image.id %>
          <% end %>
        <% end %>
      </li>
    <% end %>
  <% end %>
</ul>

The Controller

  def update
    params[:vacation][:votes] ||= []
    break

    @vacation = Vacation.find(params[:id])
    if @vacation.update_attributes(params[:vacation])
      redirect_to @vacation, :notice  => "Successfully updated vacation."
    else
      render :action => 'edit'
    end
  end

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

奢华的一滴泪 2024-11-25 10:50:50

如果您想在 params[:vacation] 哈希中使用表单中的参数:

<%= f.hidden_field :field %>

而不是

<%= hidden_field_tag :field %>

另外,您可以考虑异步发送数据,而不是在每次拖放后提交表单。

If you want to have params from the form in params[:vacation] hash use:

<%= f.hidden_field :field %>

instead of

<%= hidden_field_tag :field %>

Also you might consider sending data asynchronously instead of submitting the form after every drag&drop.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文