ruby 如何在现有模板导轨上添加下落区

hc8w905p  于 2023-01-25  发布在  Ruby
关注(0)|答案(1)|浏览(108)

我如何可以轻松地添加dropzone到我现有的形式,如何不跳过验证授权令牌?我的旧上传图像没有指责我尝试添加列"文件"到产品库。我不知道如何添加dropzone到我的形式,而不创建新的迁移只为图像。有人能帮助我吗?
查看:

<%= simple_form_for [:user, @product], html: {id: "dropzone-form- 
    id"} do |f| %>
    <%= f.input :name, label: "Nazwa" %>
    <%= f.input :description, label: "Opis" %>
    <%= f.input :long_description, label: "Długi opis" %>
    <%= f.input :price, label: "Cena" %>
    <%= f.association :category, label: "Kategoria" %>
    <%= f.input :condition, label: "Stan", :collection => 
    [['Nowy','Nowy'],['Używany','Używany']] %>

    <div id="files-field"
       class="dropzone"
       style="border: 2px dashed rgba(0, 0, 0, 0.3);
              min-height: 100px !important;">
    <div class="dz-message"
         style="margin: 20px">
      Drag your cats' pics here! Or
      <button>
        select files
      </button>
    </div>
    </div>

    <p>
    <%= f.submit %>
    </p>
    <% end %>

upload-dropzone.js

// .js file
Dropzone.options.filesField = {
  url: "/user/products",
  addRemoveLinks: true,
  autoProcessQueue: false,
  uploadMultiple: true,
  accept: function(file, done) {
    $("div#files-field").css({"height": "auto"});
    done();
  },
  init: function() {
    var myDropzone = this;

    var form = document.getElementById('dropzone-form-id');
    form.addEventListener('submit', function(event) {
      // stop the form's submit event
      if(myDropzone.getQueuedFiles().length > 0){
        event.preventDefault();
        event.stopPropagation();
        myDropzone.processQueue();
      }
    });

    myDropzone.on("sendingmultiple", function(file, xhr, formData) {
      formData.append("name", $('#product_name').val());
      formData.append("description", $('#product_description').val());
      formData.append("long_description", $('#product_long_description').val());
      formData.append("price", $('#product_price').val());
      formData.append("category", $('#product_category_id').val());
      formData.append("condition", $('#product_condition').val());
    });
  },
  successmultiple: function(data,response) {
    alert(response);
  }
};

产品控制员:

skip_before_action :verify_authenticity_token

    def create
      @product = Product.new(product_params)
      @product.user_id = current_user.id
      if @product.save
        redirect_to user_products_path, notice: "Pomyślnie dodano 
     produkt."
      else
        render action: :new
       end
    end

    private

    def product_params
      params.require(:product).permit(
        :name,
        :category_id,
        :description,
        :long_description,
        :price,
        {photo: []},
        :condition
      )
    end

Started POST "/user/products" for 127.0.0.1 at 2019-07-30 15:29:27 +0200
Processing by User::ProductsController#create as JSON
Parameters: {"name"=>"", "description"=>"", "long_description"=>"", "price"=>"", "category"=>"", 
"condition"=>"", "file"=>{"0"=>#<ActionDispatch::Http::UploadedFile:0x00007fbe12aa45d8 @tempfile=# 
<Tempfile:/tmp/RackMultipart20190730-32614-658ixz.png>, @original_filename="Zrzut ekranu z 2019-03- 
05 11-37-48.png", @content_type="image/png", @headers="Content-Disposition: form-data; 
name=\"file[0]\"; filename=\"Zrzut ekranu z 2019-03-05 11-37-48.png\"\r\nContent-Type: image/png\r\n">}}
User Load (0.2ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = ? ORDER BY "users"."id" ASC 
LIMIT ?  [["id", 2], ["LIMIT", 1]]
↳ /home/dondaro/.rvm/gems/ruby-2.5.3/gems/activerecord-5.2.2/lib/active_record/log_subscriber.rb:98
Completed 400 Bad Request in 2ms (ActiveRecord: 0.2ms)


ActionController::ParameterMissing (param is missing or the value is empty: product):

app/controllers/user/products_controller.rb:60:in `product_params'
app/controllers/user/products_controller.rb:27:in `create'
f87krz0w

f87krz0w1#

在javascript中添加此表单数据

formData.append("authenticity_token", $('input[name="authenticity_token"]').val());

或者如果只发送1个文件,请将其添加到dropzone配置中

headers: {'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content') },

相关问题