Question

我正在创建一个重置密码的弹出框，下面是我点击打开弹出框的按钮：

<table align="center" width="80%">
                <tr>
                    <td align="center">
                        <div class="button">
                            <a id="ResetPass" class="buttonSearch">Open</a>
                        </div>
                    </td>
                </tr>
</table>

下面是找到按钮并用于打开弹出框的javascript函数：

    <script type="text/javascript">
        var el=document.getElementById("ResetPass");
        el.onclick = show_dialog2;
        function show_dialog2() {
        $( "#dialog" ).dialog();
        }
    </script>

下面是包含表单和控件的div：

<div id="dialog" style="visibility:hidden" title="Reset Password" type="hidden">
                <%= form_tag({ controller: "settings", action: "reset_password"}, remote: "true" ) do |f| %>
                    <table style="text-align:center; vertical-align:top;">
                        <tr>
                            <td>

                                    <p><%= label_tag(:name, "Name") %>
                                    <%= text_field_tag(:name) %></p>


                            </td>
                        </tr>
                        <tr>
                            <td>
                                <div>
                                    <%= text_field_tag( :newpassword, :placeholder => "New Password", :style => "text-align: center; BackColor:#e5e5e5; Width: 150px; ForeColor: Gray; Font-Size: Large;") %>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <div>
                                    <%= text_field_tag( :reenterpassword, :placeholder => "Re-enter Password", :style => "text-align: center; BackColor: #e5e5e5; Width: 150px; ForeColor: Gray; Font-Size: Large;") %>
                                </div>
                            </td>
                        </tr> 
                    </table>
                    <table>
                        <tr>
                            <td>
                                <%= submit_tag 'Submit', :id => "_button" %>
                            </td>
                        </tr>
                    </table>
                <% end %>
</div>

但问题是，当我在文本框中输入值并单击提交按钮时，弹出框不会出现，请帮助我等待您的回复。感谢。

Answer 1

你是否使用bootstrap 3作为弹出窗口？如果是这样的话，那么当响应得到成功结果时，你必须添加动作以关闭模态。

$('#dialog').modal('hide');

希望有所帮助

Answer 2

您可以尝试添加以下代码：

<script type="text/javascript">
$(document).ready(function() {
    // '_button' is the Id of your submit button
    $("#_button").click(function() {            
      $(this).closest("form").submit();
      $("#dialog").dialog("close");
    });
});
</script>

当我在rails上的ruby中使用ajax单击提交按钮时弹出框不会出现

2 个答案: