从jquery get请求运行rails RJS模板

时间:2021-02-27 22:25:40

I am using Rails and jquery with RJS templates to perform various AJAX requests.

我正在使用Rails和jquery与RJS模板来执行各种AJAX请求。

For most of my Ajax stuff I attach a submit handler to the form in my application.js as follows:

对于我的大多数Ajax内容,我将一个提交处理程序附加到我的application.js中的表单,如下所示:

$('#tagging_flickr_photos').submitWithAjax();
$('#tag_submit').click(function() {
    $('#flickr-photos-status').show();

});

This calls the form action which does some processing and then forwards to a RJS template as follows:

这会调用表单操作进行一些处理,然后转发到RJS模板,如下所示:

$("#flickr-photos-status").hide();
$("#flickr-photos").fadeIn();
$("#flickr-photos").html("<%= escape_javascript(render(:partial => 'flickr_photos_for_tagging_content')) %>");

This works a treat.

这是一种享受。

Now I am trying to do the same but just based on selecting a different value in a dropdown and not submitting a form. Here's my javascript to attach the handler to the dropdown:

现在我尝试做同样的事情,但只是基于在下拉列表中选择不同的值而不是提交表单。这是我的javascript将处理程序附加到下拉列表:

$('#film_film_name_id').change(function() {
    $.get('/admin_film/make_tags?film_name_id=' + $("#film_film_name_id").val() + '&film_speed_id=' + $("#film_film_speed_id").val());
});

My controller method does some processing then forwards to the RJS template (make_tags.js.erb):

我的控制器方法做了一些处理,然后转发到RJS模板(make_tags.js.erb):

$("#film_tags").val(<%=@tags%>)

However, the template doesn't appear to execute. I can see entries in my logs that it's calling my method and rendering the template but no matter what I put in the template nothing seems to happen. I've put a Javascript alert in there and it doesn't fire.

但是,模板似乎不会执行。我可以在日志中看到它正在调用我的方法并呈现模板的条目,但无论我在模板中放置什么似乎都没有发生。我在那里放了一个Javascript警报但它没有触发。

I assume the problem is to do with attaching my Javascript handler but I can't figure out what I am missing.

我假设问题是附加我的Javascript处理程序,但我无法弄清楚我缺少什么。

Thanks in advance for any help.

在此先感谢您的帮助。

4 个解决方案

#1


I think you have to tell jQuery that you are expecting JavaScript and that it should be executed. Try the following and see if it works:

我想你必须告诉jQuery你期待JavaScript并且应该执行它。尝试以下操作,看看它是否有效:

$('#film_film_name_id').change(function() {
  var url = '/admin_film/make_tags?film_name_id=' + $("#film_film_name_id").val() + '&film_speed_id=' + $("#film_film_speed_id").val()
  $.ajax({
    type: 'GET',
    dataType: 'script',
    url: url
  });
});

Please check the jQuery docs on jQuery.ajax() if it doesn't work as I haven't tested the code.

如果它不起作用,请检查jQuery.ajax()上的jQuery文档,因为我没有测试代码。

#2


HI,

I'm using an observer that calls directly through the prototype library (not jquery)

我正在使用一个直接通过原型库调用的观察者(而不是jquery)

        <td><div id="outconditionnals_container">
                <% if !@milestone.howto.conditionnals.nil? then %>
                        <%= collection_select(:OUTconditionnal, :id, @milestone.howto.conditionnals, :id, :name, {:prompt => true}, {"index" => @outconditionnalID.to_s}) %>
                        <%= observe_field("OUTconditionnal_"+@outconditionnalID.to_s+"_id",
                                :url => { :action => :AJAX_selection_change },
                                :with => "'id='+value+'&dir=out&type=conditionnal&milestoneID="+@milestone.id.to_s+"'",
                                :on => "changed")%>                         
                <% end %>
            </div>
        </td>

Then my rjs is rendered from my action to referesh some other form elements.

然后我的rjs从我的动作中呈现出来以引用其他一些形式元素。

Hope this helps.

希望这可以帮助。

#3


Alternatively, you could also go with the $.get you've been using.
Here's your example with a hairdo:

或者,你也可以使用你一直在使用的$ .get。这是你发型的例子:

$('#film_film_name_id').change(function() {
    $.get(
      '/admin_film/make_tags', // or something like '<%= make_tags_admin_film_path %>'
      {
        film_name_id: $("#film_film_name_id").val(),
        film_speed_id: $("#film_film_speed_id").val()
      },
      null, // you may define an additional callback here, if that makes sense
      "script"
    );
});

#4


The jQuery method getScript is a nice shorthand for doing what ujh recommended above.

jQuery方法getScript是一个很好的简写,用于执行上面推荐的ujh。

#1


I think you have to tell jQuery that you are expecting JavaScript and that it should be executed. Try the following and see if it works:

我想你必须告诉jQuery你期待JavaScript并且应该执行它。尝试以下操作,看看它是否有效:

$('#film_film_name_id').change(function() {
  var url = '/admin_film/make_tags?film_name_id=' + $("#film_film_name_id").val() + '&film_speed_id=' + $("#film_film_speed_id").val()
  $.ajax({
    type: 'GET',
    dataType: 'script',
    url: url
  });
});

Please check the jQuery docs on jQuery.ajax() if it doesn't work as I haven't tested the code.

如果它不起作用,请检查jQuery.ajax()上的jQuery文档,因为我没有测试代码。

#2


HI,

I'm using an observer that calls directly through the prototype library (not jquery)

我正在使用一个直接通过原型库调用的观察者(而不是jquery)

        <td><div id="outconditionnals_container">
                <% if !@milestone.howto.conditionnals.nil? then %>
                        <%= collection_select(:OUTconditionnal, :id, @milestone.howto.conditionnals, :id, :name, {:prompt => true}, {"index" => @outconditionnalID.to_s}) %>
                        <%= observe_field("OUTconditionnal_"+@outconditionnalID.to_s+"_id",
                                :url => { :action => :AJAX_selection_change },
                                :with => "'id='+value+'&dir=out&type=conditionnal&milestoneID="+@milestone.id.to_s+"'",
                                :on => "changed")%>                         
                <% end %>
            </div>
        </td>

Then my rjs is rendered from my action to referesh some other form elements.

然后我的rjs从我的动作中呈现出来以引用其他一些形式元素。

Hope this helps.

希望这可以帮助。

#3


Alternatively, you could also go with the $.get you've been using.
Here's your example with a hairdo:

或者,你也可以使用你一直在使用的$ .get。这是你发型的例子:

$('#film_film_name_id').change(function() {
    $.get(
      '/admin_film/make_tags', // or something like '<%= make_tags_admin_film_path %>'
      {
        film_name_id: $("#film_film_name_id").val(),
        film_speed_id: $("#film_film_speed_id").val()
      },
      null, // you may define an additional callback here, if that makes sense
      "script"
    );
});

#4


The jQuery method getScript is a nice shorthand for doing what ujh recommended above.

jQuery方法getScript是一个很好的简写,用于执行上面推荐的ujh。