Question

我想通过ajax更新部分视图product_images.html.erb 我的js代码是

    $("#delete-img").click(function(e){
      var checkValues = $('input[name=image_id]:checked').map(function(){
          return $(this).val();
      }).get();
      var id = $("#product_id").val();
      if(checkValues.length == 0) {
          alert("Select checkboxe first");
      }
      else{
          $.ajax({
              url: '/products/delete_product_images',
              type: 'delete',
              data: { ids: checkValues, id: id },
              success:function(data){
                  $('.product_images_class').html("<%= escape_javascript(render 'sproduct_images')%>");
              }
          });
      }

  });

但是在成功之后，它会在该类中写<%= escape_javascript(render 'product_images')%>而不是更新。还有别的办法吗？

Answer 1

问题是因为您在前端视图中调用了 server 代码。

<强> JS

当你调用Ajax时，你基本上使用前端JS向你的后端Rails架构发送异步请求。

这意味着您在前端Ajax 中执行的任何操作都使用屏幕上的内容，或者在服务器响应中发回的内容。

您正在做的是混合前端ajax（IE $.ajax）与ERB的后端$('.product_images_class').html("<%= escape_javascript(render 'sproduct_images')%>");功能

有两种方法：

<强> 1。致电服务器端JS

第一个修复方法是使用respond_to functionality of Rails：

#app/controllers/products_controller.rb
class ProductsController < ApplicationController
   def destroy
      respond_to do |format|
        format.js #-> invokes app/views/products/destroy.js.erb
      end
   end
end

这将有效地替换前端ajax中的success回调：

#app/views/products/destroy.js.erb
$('.product_images_class').html("<%=j render "product_images" %>");

 #Front-end codr
 $.ajax({
          url: '/products/delete_product_images',
          type: 'delete',
          data: { ids: checkValues, id: id }
 });

-

<强> 2。将部分发送到您的前端Ajax

#app/controllers/products_controller.rb
class ProductsController < ApplicationController
   def destroy
      if request.xhr? render "sproduct_images", layout: false
   end
end

#Front-end code
 $.ajax({
          url: '/products/delete_product_images',
          type: 'delete',
          data: { ids: checkValues, id: id },
          success: function(data) {
             $('.product_images_class').html(data);
          }
 });

Answer 2

你只是想在javascript中渲染部分内容。您应该查看成功函数中传递的data参数，如下所示：

     success:function(data){
        $('.product_images_class').html(data);
     }

如何在rails上更新ruby中的局部视图

2 个答案: