0

我正在尝试将 asp.net 网格行按钮用于模态弹出窗口，它用于警报但无法调用模态弹出窗口，我该如何解决？

<div id="confirm" class="modal hide fade">
  <div class="modal-body">
    Are you sure?
  </div>
  <div class="modal-footer">
    <button type="button" data-dismiss="modal" class="btn btn-primary" id="delete">Delete</button>
    <button type="button" data-dismiss="modal" class="btn">Cancel</button>
  </div>
</div>

 <asp:Button ID="btnDeletes" ToolTip="Delete" CommandArgument="<%# Container.DataItemIndex %>" OnClick="btnDelete_Click1" OnClientClick="test();"
                                                                CssClass="GridDeletebtn" runat="server" />

<script>
function test() 
{
    $('#confirm').show();
    alert('df');
}
</script>
4

4 回答 4

1

当您调用时alert('df')，线程将被阻止，直到您单击警报的“确定”按钮，然后才会发生回发。

但是当你只显示模态对话框（没有alert）时，它不会阻塞线程，因此回发会立即发生。

因此，您的模态对话将在回发后消失。

当您如下添加“return false”时，它将停止回发。

<asp:Button ID="btnDeletes" ToolTip="Delete" CommandArgument="<%# Container.DataItemIndex %>" OnClick="btnDelete_Click1" OnClientClick="test();return false;" CssClass="GridDeletebtn" runat="server" />

脚本

<script>
   function test()
            {
                $('#confirm').modal('show');
                //alert('df');
            }
        </script>

html

<div id="confirm" class="modal hide fade" tabindex="-1" role="dialog">
  <div class="modal-body">
    Are you sure?
  </div>
  <div class="modal-footer">
    <button type="button" data-dismiss="modal" class="btn btn-primary" id="delete">Delete</button>
    <button type="button" data-dismiss="modal" class="btn">Cancel</button>
  </div>
</div>
于 2016-11-04T03:16:50.210 回答
0

如果你能分享一个我可以测试的网址。那我试试看。此外，尝试捕获类名而不是 id。像下面这样的东西。

$('.modal').show();

于 2016-11-04T02:58:03.957 回答
0

如果您使用gridview或repeater然后通过下面的代码调用模态弹出窗口它对我有用

<a class="btn btn-sm btn-warning" data-toggle="modal" data-target="#Remark_Modal<%# Eval("PrimaryID")%>">
    <i class="fa fa-eye"></i>&nbsp;Details
</a>

<!--Modal-->
<div class="modal fade" id='Remark_Modal<%# Eval("PrimaryID")%>' role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content card-blue-fill">
            <div class="modal-header card-header">
                <button type="button" class="modal-close" data-dismiss="modal" aria-label="Close">
                    <i class="fa fa-2x fa-close"></i>
                </button>
                <h4 class="modal-title"><i class="fa fa-eye"></i>&nbsp; <%# Eval("MissionName")%></h4>
            </div>
            <div class="modal-body card-block">
                <%# Eval("Remark")%>
            </div>
        </div>
    </div>
</div>
于 2016-11-04T04:23:58.947 回答
0

在模式的开头使用 ScriptManager 标记，否则 ScriptManager.RegisterStartupScript 将不起作用。以下是我使用的解决方法。

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <asp:ScriptManager ID="ScriptManager" runat="server"></asp:ScriptManager>
    <div class="modal fade" id="myModal" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <asp:UpdatePanel ID="upModal" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
                <ContentTemplate>
                    <div class="modal-content">
                        <div class="modal-header">
                            <h4 class="modal-title"><asp:Label ID="errorMessage" runat="server" Text=""></asp:Label></h4>
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        </div>
                    </div>
                </ContentTemplate>
            </asp:UpdatePanel>
        </div>
    </div>

代码隐藏

private void showModal(string error)
        {
            message.Text = error;
            upModal.Update();
            ScriptManager.RegisterStartupScript(Page, Page.GetType(), "myModal", "$(document).ready(function () {$('#myModal').modal();});", true);
        }

使用适当的消息调用上述 showModal() 函数。如果需要，您可能必须添加模态页眉和模态页脚。

于 2020-07-27T08:23:05.183 回答