Ruby on rails 通过Javascript在Rails中提交Select2表单,并在

Ruby on rails 通过Javascript在Rails中提交Select2表单,并在,ruby-on-rails,simple-form,acts-as-taggable-on,jquery-select2,Ruby On Rails,Simple Form,Acts As Taggable On,Jquery Select2,当访问页面的用户是所有者时,我会在页面上显示一个标签列表。我希望这个人能够调整标签的照片直接在页面上。添加标记后,它将根据照片更新Acts As taggable on字段。我真的很快就能让一切正常工作了,唯一无法成功完成的事情就是远程保存这些数据(当我在页面上添加提交按钮并单击此按钮时,它会起作用。) Gems:(我已经手动添加了Select2的脚本) 我的表格: <%= simple_form_for [@mountain, @photo], remote: true do |f| %

当访问页面的用户是所有者时,我会在页面上显示一个标签列表。我希望这个人能够调整标签的照片直接在页面上。添加标记后,它将根据照片更新Acts As taggable on字段。我真的很快就能让一切正常工作了,唯一无法成功完成的事情就是远程保存这些数据(当我在页面上添加提交按钮并单击此按钮时,它会起作用。)

Gems:(我已经手动添加了Select2的脚本)

我的表格:

<%= simple_form_for [@mountain, @photo], remote: true do |f| %>
    <%= f.input :tag_list, label: false, :input_html => {class: 'select2-container select2-container-multi', style: 'width:100%'}  %>
    <%= f.submit "Update tags" %>
<% end %>

{class:'select2 container select2 container multi',style:'width:100%}%>
我希望删除此表单中的提交按钮

以下是将表单呈现为带标记的Select2表单的脚本:

<script type="text/javascript">
    $("#photo_tag_list").select2({tags:[], width: 'resolve', placeholder: "Add photo tags" });
    $("#photo_tag_list").on("change", function() { 
        $("#photo_tag_list_val").html($("#photo_tag_list").val());
    });

    $("#photo_tag_list").select2("container").find("ul.select2-choices").sortable({
    containment: 'parent',
    start: function() { $("#photo_tag_list").select2("onSortStart"); },
    update: function() { $("#photo_tag_list").select2("onSortEnd"); }
    });
</script>

$(“#照片标签列表”)。选择2({tags:[],宽度:'解析',占位符:“添加照片标签”});
$(“#照片#标签#列表”)。在(“更改”,函数(){
$(“#photo#tag_list_val”).html($(“#photo#tag_list”).val());
});
$(“照片标签列表”).select2(“容器”).find(“ul.select2选项”).sortable({
包含:'父',
开始:函数(){$(“#照片(标签)列表”)。选择2(“onSortStart”);},
更新:function(){$(“#photo_tag_list”)。选择2(“onSortEnd”)}
});
在chrome控制台的帮助下,我尝试了以下方法来提交表单:1)向标记列表添加一个值,2)转到控制台并运行$(“#photo_tag_list”).submit();。我收到以下消息,其中我添加的值不在value=”“范围内

提前感谢您的帮助!请让我知道,如果它是有帮助的,看看更多的代码

<script type="text/javascript">
    $("#photo_tag_list").select2({tags:[], width: 'resolve', placeholder: "Add photo tags" });
    $("#photo_tag_list").on("change", function() { 
        $("#photo_tag_list_val").html($("#photo_tag_list").val());
    });

    $("#photo_tag_list").select2("container").find("ul.select2-choices").sortable({
    containment: 'parent',
    start: function() { $("#photo_tag_list").select2("onSortStart"); },
    update: function() { $("#photo_tag_list").select2("onSortEnd"); }
    });
</script>
<input class=​"string optional select2-container select2-container-multi" id=​"photo_tag_list" name=​"photo[tag_list]​" size=​"50" style=​"width:​ 100%;​ display:​ none;​" type=​"text" value=​"description_blank, pack, champions">​