有一个下拉菜单中选择使用
<%= select("array", "folder", @rows.keys, {}, :onchange =>"?" )%>
有部分所谓的“形式”
<%= render "form"%>
我需要呈现局部每当有选择的变化。 请让我知道如果有一种方法可以做到这一点。 我发现remote_function
从轨3.0弃用。 我在这里跟平变化和选择标签看到所有可能的联系也没有找到一个合适的回答。 我是新来的铁轨,jQuery和阿贾克斯。 请帮忙
谢谢
为什么不呈现在同一页面的形式和隐藏,并显示在选择标签的变化
<html>
<body>
<!-- Your Select tag -->
<select id="select_id">
<option value="one" selected> One </option>
<option value="two"> Two </option>
</select>
<!-- Here your a div inside with your form is placed -->
<div id="myform" style="display:none">
<form action="/someurl">
.. ..
</form>
<!-- JQuery code to show the form -->
<script type="text/javascript">
$(document).ready(function() {
$("select#select_id").bind("change",function() {
if ($(this).val() == "one")
$("div#myform").show();
else
$("div#myform").hide();
})
})
</script>
</html>
我仍然想打一个Ajax请求我很简单太
$(document).ready(function() {
$("select#select_id").bind("change",function() {
if ($(this).val() == "one") {
$.ajax({
url : "/form_url",
data : "html",
type: "GET",
success : function(data) {
$("div#myform").html(data)
}
})
})
})
在服务器端则需要使用的respond_to Ajax请求format.js
并呈现模板定向使用渲染命令或只是定义.js.erb
文件
肯定是有办法做到这一点,它的一些工作,但一旦你得到了它的窍门它很容易。
首先,你要一个jQuery功能附加到change
你的选择框的事件。 这可以通过添加一些JavaScript您要做application.js
文件。 我们想在这里做,所以我们的javscript仍然unobtrustive 。 你可以尝试这样的事情在你application.js
文件中:
$(document).ready(function(){
$("#select_field_id").change(function(){
var id = $(this).children(":selected").val();
var params = 'some_id=' + id;
$.ajax({
url: "/some_controller/change_folder",
data: params
})
});
这样做是附加一个匿名函数来change
一个选择栏的ID为事件select_field_id
。 当那场改变时, id
所选选项都存储在var id
,然后我们创造,我们将通过执行发送请求的参数var params = 'some_id=' + id;
。 some_id
是无论你改变(所以的ID folder_id
如果这就是你正在使用你的例子是什么)。
现在,我们需要创建一个可以处理我们的控制器此请求的方法。 因此,与该文件夹例如去,将其添加到该文件夹控制器:
def change_folder
@folder = Folder.find(params[:some_id])
respond_to do |format|
format.js
end
end
这可以简单地认为基于您的Ajax请求发送的ID文件夹change_folder
。 它也将寻找一个相应的change_folder.js.erb
或change_folder.js
文件进行渲染。
现在我们需要写一个change_folder.js.erb
文件。 我们需要更换上我们得到了新的文件夹,你的页面的某些部分的HTML,所以你应该有某种形式的div
或其他部分有唯一的ID。
里面change_folder.js.erb
,我们可以这样写:
$('#your_div').html("<%= escape_javascript(render(partial: "folder",
locals: { :folder => @folder })).html_safe %>")
这将使部分称为_folder.html.erb
是在同一目录中change_folder.js.erb
文件。 该部分将需要使用@folder变量用于显示领域,所以你会需要这样的东西:
<%= @folder.name %>
<%= @folder.last_updated %>
里面你_folder.html.erb
部分。 .name
和.last_updated
当然只是做了一个文件夹模式的特性。 你必须使用你给什么属性您的文件夹,而不是模型。
这应该让你去到你需要的人。 请让我知道如果你需要任何澄清。