【问题标题】:Fill in and submit form with link outside this form填写并提交带有此表格外链接的表格
【发布时间】:2014-04-30 15:12:32
【问题描述】:

我想填写在点击表单外的链接时提交关注表单,使用链接的内容。

<%= form_tag search_path, url: search_path, remote: true do %>
    <div class='input-group'>
        <div class='search-box'>
            <%= text_field_tag 'query', nil, class: 'form-control typeahead', autocomplete: 'off' %>
            </div>

            <span class='input-group-btn'>
                <button type='button' class='btn btn-default' data-toggle='modal' data-target='#settingsmodal'>
                    <span class='glyphicon glyphicon-cog'></span>
                </button>
                <%= submit_tag t('process.search'), id: 'search_button', class: 'btn btn-primary' %>
            </span>
        </div>
        <%= render 'settings_modal' %>
<% end %>

...

<a href="#">This text should be submitted</a>

我尝试使用 jQuery 填写文本字段并单击按钮,但这不起作用。我阅读了有关 jQuery submit() 调用的信息,但不知道如何使用它。有什么帮助吗?

【问题讨论】:

    标签: jquery ruby-on-rails forms


    【解决方案1】:

    这会将文本添加到输入框并提交表单

    <a href="#" onclick="$('.search-box input').val($(this).html()); $('form').submit(); return false;">This text should be submitted</a>
    

    编辑:

    正如我在评论中提到的,更好的方法是在 JS 文件中使用这样的 ID:

    <form id="form-id">
        <input id="search-box-input" value="" />
    </form>
    
    <a href="#" id="link-id">This text should be submitted</a>
    
    <script type="text/javascript">
        $(function(){
            $("#link-id").click(function(){
                $('#search-box-input').val($(this).html()); 
                $('#form-id').submit();
                return false;
            });
        });
    </script>
    

    【讨论】:

    • 更新了它以提交表单。从技术上讲,您可能希望为表单分配一个 id,以便您可以使用$("#form_id").submit() 访问它。另外,如果你给链接命名,你可以在一个JS文件中初始化点击函数,像这样:$("#link_id").click(function(){$('.search-box input').val($(this).html()); $('form').submit(); return false;});
    • 另外,如果您为链接分配 *ID
    • 这应该确实有效,正如我在其他几个地方看到的那样。不幸的是,这不是我的情况......我可以看到文本字段,但没有提交表单(具有 id 'form_id')。
    • 你能发布你实际渲染的 HTML 吗?也许在 jsbin.com 或 jsfiddle.com 中重复该问题?
    • &lt;input type="submit" form="form_id" /&gt; 也不工作
    猜你喜欢
    • 1970-01-01
    • 2018-08-16
    • 1970-01-01
    • 1970-01-01
    • 2015-05-13
    • 1970-01-01
    • 1970-01-01
    • 2020-05-12
    • 2012-02-03
    相关资源
    最近更新 更多