Question

我在sidekiq中使用了gem'jquery-fileupload-rails'和'carrierwave_backgrounder'gem。如何在下载完成后添加重新加载页面？

问题是下载位于后台中，页面会立即重新加载，而不是在加载图片时

fileupload.js

  $(function () {
      $('#new_photo').fileupload({
          acceptFileTypes: '/(\.|\/)(gif|jpe?g|png)$/i',
          dataType: 'html',
          add: function (e, data) {
              data.context = $('#loading').css({display:"block"}).appendTo('#photos');
              data.submit();
          },
          done: function (e, data) {
              data.context.text('Upload finished.');
              location.reload();
          }
      });
  });

image_upload.html.erb

  <div class="upload" id="new_photo">
    <%= form_for([@project, current_user.photos.new]) do |f| %>
      <%= file_field_tag :image, multiple: true, name: "photo[image]" %>
      <%= link_to 'Save', @project, :class => 'btn btn-success' %>
    <% end %>
    <div id="loading">
      <h4>Loading</h4>
    </div>
  </div>
  <div class="image-upload">
    <% @project.photos.each do |photo| %>
      <%= image_tag photo.image_url.to_s %>
      <p><%= link_to "Delete", project_photo_path(@project, photo), :method => :delete, :class => 'btn' %></p>
    <% end %>
  </div>

Answer 1

只需从location.reload部分移除Done，然后检查加载的图片是否$("#image")然后点击window.location.reload

Answer 2

我认为您可以尝试在javascript函数中使用Ajax。下载完成后，然后触发ajax调用到控制器/方法，您的方法将自动再次将页面渲染回视图。您回调控制器的原因可能会帮助您将所有即时变量扩展到您的视图。

$.ajax({
 url: 'controller/method',
 type: 'post',
 data: 'YOUR DATA or Nothing',
 success: function(data) {}   
});

如果您不需要成功功能，那么您只需使用网址并发布。尝试一下，你就可以搞清楚了。

Answer 3

来自jquery fileuploader documentation on callbacks的

，您可以绑定在上传完成后将触发的success事件。

jqXHR = data.submit()
  .success(function() { window.location.reload() })

上传图片后如何重新加载页面

3 个答案: