Ruby on Rails：根据选择框中的更改提交表单作为JS

I have the following HTML generated by form_tag and select_tag in Rails:

我在raails中的form_tag和select_tag生成了以下HTML:

<form accept-charset="UTF-8" action="/deployment_group/show_workflow_list" data-remote="true" id="show_workflow_list_form" method="get"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /></div>
  <select id="folder_name_foldernames" name="folder_name[foldernames]">
    <option value="RISK_ODS" selected="selected">RISK_ODS</option>
    <option value="DETAIL_ADJUSTMENT">DETAIL_ADJUSTMENT</option>
    <option value="ODS_STAGE">ODS_STAGE</option>
    <option value="FINANCE_DM1">FINANCE_DM1</option>
  </select>
</form>

Let me know the JQuery code i need to write so that i can submit the form on change of a select value in the drop down. Please see here that when i use :onchange, it is a html option the form is submitted as html and not as a JS form. So, i cannot use :onchange.

让我知道我需要编写的JQuery代码,以便我可以在下拉列表中更改选择值时提交表单。请看这里当我使用:onchange时,它是一个html选项,表单以html的形式提交,而不是作为JS表单提交。所以,我不能使用:onchange。

I understood that i need to write something like this in my application.js file:

我明白我需要在application.js文件中写这样的东西:

$(#folder_name_foldernames).change(function(){
    $(#show_workflow_list).submit()
});

I used the above code in application.js file but i have to remove "require_tree ." as i get some error so i added

我在application.js文件中使用了上面的代码但是我必须删除“require_tree”。因为我得到一些错误,所以我补充说

$('#folder_name_foldernames').change = () ->
  $('#show_workflow_list_form').submit()

to my deployment_group.js.coffee file (the deployment_group is my controller related the above view)

到我的deployment_group.js.coffee文件(deployment_group是我的控制器与上面的视图相关)

But still i dont see any change when i change the selection in the drop down. Please help.

但是当我在下拉菜单中更改选择时,我仍然没有看到任何变化。请帮忙。

3 个解决方案

#1

I solved the problem doing it the following way:

我通过以下方式解决了问题:

<%= f.select :foldernames, options_for_select(@folders, @folders.first), {}, {:onchange=>"myfunc()"}%>

and i added

我补充道

<script type="text/javascript">
function myfunc()
{
    $('#folder_name_foldernames').change(function(){     $('#this_form').submit(); }); 
}
</script>

and the form is being submitted as JS instead of HTML. It would be very helpful if someone can explain me why this is being submitted as JS instead of HTML The same code when i write :onchange=> this.form.submit, is being submitted as HTML

并且表单以JS而不是HTML的形式提交。如果有人可以解释我为什么将它作为JS而不是HTML提交,那将是非常有帮助的。当我编写时,相同的代码:onchange => this.form.submit,正在以HTML格式提交

#2

If you give an id to your <form> tag you can use the id there.

如果您为

Like:

<form accept-charset="UTF-8" action="/deployment_group/show_workflow_list" data-remote="true" id="this_form" method="get"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /></div>
<select id="folder_name_foldernames" name="folder_name[foldernames]"><option value="RISK_ODS" selected="selected">RISK_ODS</option>
    <option value="DETAIL_ADJUSTMENT">DETAIL_ADJUSTMENT</option>
    <option value="ODS_STAGE">ODS_STAGE</option>
    <option value="FINANCE_DM1">FINANCE_DM1</option>
</select>

and then:

$('#folder_name_foldernames').change(function(){
    $('#this_form').submit();
});

Don't forget to wrap your selectors in quotes or you'll get a JavaScript error.

不要忘记将引号括起来,否则会出现JavaScript错误。

#3

Try to repliace 'application.js' by 'application.js.coffee' and add #= require_self in the file.

尝试通过'application.js.coffee'重新传递'application.js'并在文件中添加#= require_self。

#1