使用ajax

Question

我是网络编程的新手。所以我一直在网上搜索一下我自己解决这个问题，但似乎没有人有类似的问题。

在我的程序中，我收到的用户输入包含通过我的app/views/booths/new.html.erb文件中的textarea创建的新展位的管理员，如下所示。

app / views / booths / new.html.erb：

<% provide(:title, 'Create New Booth') %>
<h1>Create New Booth</h1>

<% javascript_include_tag "booths" %>

<div>
  <div>
    <%= form_for(@booth) do |f| %>
      <%= f.label :booth_name, "Name of the new Booth" %>
      <%= f.text_field :booth_name %>

      <%= f.label :booth_description, "Describe your new Booth" %>
      <%= f.text_field :booth_description %>

      <%= f.label :important_notice, "Any important notices?" %>
      <%= f.text_field :important_notice %>

      <span><br>Admins for this Booth?<br> </span>
      <textarea id="create_booth_admins_textarea" rows="30" cols="50"> </textarea>

      <%= f.submit "Create a new booth", :id => "booth_create_submit"%>
    <% end %>
  </div>
</div>

app / assets / javascripts / booths.js摘录：

admins = $("textarea#create_booth_admins_textarea").val();

$('#booth_create_submit').click(function() {
    $.ajax({
        url: "/booths_create",
        data: {  "booth_admin_emails" : admins},
        type: "post",
        cache: false,
        success: function () {
            console.log("ajax successful");
            alert("ajax successful");
        },
        error: fucntion() {
            console.log("ajax error");
            alert("ajax error")
        }
    }); 
});

app / controller / booths_controller.rb：

def new
        @booth = Booth.new
        @other_members = []
        @booth_admins = []
    end

    def create
        temp_hash = booth_params
        @booth = Booth.new(temp_hash.except(:booth_admin_emails))
        @booth.admin_id = current_user.id               #fill in the Booth table

        @booth_admins = temp_hash[:booth_admin_emails]

        booth_admins = []

        if @booth.save
            #fill in join table
            BoothUser.create(:user_id => current_user.id, :booth_id => @booth.id, :is_admin => true) #add current user

            if !@booth_admins.nil?
                booth_admins = @booth_admins.split(",")
            end

            if !booth_admins.empty?
                booth_admins.each do |email|
                    BoothUser.create(:user_id => User.where("email=?", email).id, :booth_id => @booth.id, :is_admin => true)
                end
            end

            # just a flash to tell user that new booth was created
            name = @booth.booth_name
            flash[:success] = "New Booth #{name} created!"
            redirect_to '/booths'
        else
          render('show')
        end
    end

    private
    def booth_params
        params.require(:booth).permit(:booth_name, :booth_description, :important_notice, :booth_admin_emails)
    end

用户和Booth属于has_many through关联，其中连接表称为BoothUser，其中包含booth_id, user_id, is_admin的信息，其中id是特定用户的指示和各个表格中的booth和is_admin是一个布尔值，用于检查用户是否是展位的管理员（具有编辑展位设置的权限）。

问题出现了，因为在我的Booth表中，我只声明了展位的创建者，并且没有跟踪该展位的给定管理员，但是我试图通过查找连接表来找到该展位的管理员。 booth_id与该展位的索引匹配，is_admin为真。

我一直试图将控件中create_booth_admins_textarea上输入的内容传递给:booth_admin_emails但到目前为止没有运气，因为没有任何内容传递到:booth_admin_emails。我猜是因为:booth_admin_emails不是Booth或User或BoothUser模型的属性。

我在Web上发现的是使用强参数（？）传递参数的方法，以使用form_for或ajax来允许模型的属性。但似乎没有人将不模型属性的输入传递给控制器​​。

所以，我想问是否有办法这样做，如果有，我该怎么做？或者是不允许的？

Answer 1

您应该能够像这样创建它：

BoothUser.create(user: current_user, booth: @booth, is_admin: true) #add current user
booth_admins.each do |email|
  admin = User.find_by(email: email)
  BoothUser.create(user: admin, booth: @booth, is_admin: true)
end

在HTML中，您需要像这样创建textarea：

<textarea id="create_booth_admins_textarea" name="booth[booth_admin_emails]" rows="30" cols="50"> </textarea>

然后你根本不需要JavaScript。

...但是，如果您希望通过AJAX提交整个表单，那么除了上面的HTML更改之外，在您的JavaScript中执行此操作：

$('#booth_create_submit').click(function(e) {
    e.preventDefault(); # keeps the HTML form from submitting.
    var the_form = $(this.form);
    $.ajax({
        url: the_form.attr('action'),
        data: the_form.serialize(),
        type: "post",
        cache: false,
        success: function () {
            console.log("ajax successful");
            alert("ajax successful");
        },
        error: fucntion() {
            console.log("ajax error");
            alert("ajax error")
        }
    }); 
});