Question

我有一个页面，显示转发器控件中的数据列表。转发器还在每行上显示2个按钮。我希望能够在单击按钮时显示引导模式框，但到目前为止我所尝试的所有内容都没有工作。

这是aspx页面的代码

<div class="container">
    <h2>Current Functions</h2>
    <asp:Repeater ID="rptFunctions" runat="server" OnItemCommand="rptFunctions_ItemCommand">
        <HeaderTemplate>
            <table class="table table-striped table-bordered">
            <tr>
                <td>FunctionID</td>
                <td>Function Name</td>
                <td>Function Description</td>
                <td>Read Only</td>
            </tr>
        </HeaderTemplate>
        <ItemTemplate>
            <tr>
                <td>
                    <%# DataBinder.Eval(Container.DataItem,"FunctionID") %>
                </td>
                <td>
                    <%# DataBinder.Eval(Container.DataItem,"FunctionName") %>
                </td>
                <td>
                    <%# DataBinder.Eval(Container.DataItem,"FunctionDescription") %>
                </td>
                <td>
                    <%# DataBinder.Eval(Container.DataItem,"ReadOnly") %>
                </td>
                <td>
                    <asp:Button ID="btnEdit" runat="server" CssClass="btn btn-default" Text="Edit" CommandName="Edit" CommandArgument='<%#Eval("FunctionID") %>'  data-toggle="modal" data-target="#myModal" />
                    <asp:Button ID="btnDelete" runat="server" CssClass="btn btn-danger" Text="Delete" CommandName="Delete" CommandArgument='<%#Eval("FunctionID") %>'  data-toggle="modal" data-target="#myModal" />
                </td>
            </tr>
        </ItemTemplate>
        <FooterTemplate>
            </table>
        </FooterTemplate>
    </asp:Repeater>
</div>

这是模态的代码。

<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">

  <!-- Modal content-->
  <div class="modal-content">
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal">&times;</button>
      <h4 class="modal-title">Modal Header</h4>
    </div>
    <div class="modal-body">
      <p>Some text in the modal.</p>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    </div>
  </div>

</div>

这是我到目前为止在代码页面

中所拥有的

       protected void rptFunctions_ItemCommand(object source, RepeaterCommandEventArgs e)
    {
        if (e.CommandName == "Edit")
        {
            Response.Write("You clicked Edit button ID " + e.CommandArgument);
        }
        else if (e.CommandName == "Delete")
        {
            Response.Write("You clicked Delete button ID " + e.CommandArgument);
        }

    }

上面的代码会告诉我我点击的按钮的名称和编号是什么，但它不会显示模态窗体。

非常感谢任何帮助。

Answer 1

添加runat =＆＃34;服务器＆＃34;你的模态：

<div class="modal fade" id="myModal" runat="server" role="dialog">

Answer 2

该页面很可能会回发，这就是您无法看到该模式的原因。您可以通过添加return false来阻止回发，但是您需要通过其他方式触发服务器端操作

.. asp：按钮ID =＆＃34; btnEdit＆＃34; RUNAT =＆＃34;服务器＆＃34; OnClientClick =＆＃34;返回false;＆＃34; ...

Answer 3

将此脚本放在 - 页面末尾。

<script>
function showModal()$('#myModal').modal('show');}
$('.show-my-modal').on('click',showModal);
</script>

在按钮CssClass="btn btn-default show-my-modal"

中添加课程

至于模态是什么，也许是一个新问题。

至于从这样的事情背后的代码这样做也许吧。（没试过这个）

protected void btnEdit_Click(object sender, EventArgs e) {   
      ScriptManager.RegisterStartupScript(this, this.GetType(),"MyFunModal", "showModal();", true);
}

您可能不希望这两个事件处理程序，只有最后一个基于您的插图代码？我会让你决定。

注意：您也可以在标记onclick="showModal()"

中拨打电话

数据切换不在转发器内的按钮上工作

3 个答案: