验证后如何显示引导模式窗口？

I'd like to create the following functionality: If user clicks on a menu item and all changes were saved or there were no changes, another page is loaded. If changes were not saved then bootstrap modal window should be shown.

我想创建以下功能:如果用户单击菜单项并保存所有更改或没有更改,则会加载另一个页面。如果未保存更改,则应显示引导模式窗口。

I have a menu like this:

我有这样一个菜单:

<div>
  <ul>
    <li><a runat="server" id="toSettings" onserverclick="toSettings_ServerClick">Settings</a</li>
     ...
  </ul>
</div>

and use the following structure for modal window:

并使用以下结构进行模态窗口:

<div id="modal" class="modal hide fade">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
        <h2>Changes not saved</h2>
    </div>
    <div class="modal-body">
        <p>
           some text
        </p>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
    </div>
</div>

C# code I've tried:

C#代码我试过了:

 if (saved)
 {
     Response.Redirect("anotherPage.aspx");
 }
 else
 {
     string script = "<script type=\"text/javascript\"> $('#modal').modal('show'); </script>";
     ClientScript.RegisterClientScriptBlock(this.GetType(), "myscript", script);
 }

but modal window doesn't appear.

但模态窗口不会出现。

I suppose that something wrong with executing script in C# code.

我认为在C#代码中执行脚本有问题。

I would be glad if someone help to correct my mistake or suggest another way to realize this functionality.

如果有人帮助纠正我的错误或建议另一种方法来实现这个功能,我会很高兴。

Thanks in advance.

提前致谢。

1 个解决方案

#1

First of all make sure you have all the jQuery-UI and bootstrap css and js files with you and properly referenced in the head section.

首先确保你拥有所有jQuery-UI和bootstrap css和js文件,并在head部分正确引用。

Next write a script in the Master-Page if you have one or in the same page at the end of the page, like this :

接下来如果您在页面末尾有一个或相同的页面,则在主页面中编写脚本,如下所示:

<script type="text/javascript">
function openModal() {
    $('#myModal').modal('show');
}
</script>

Then I could call the modal popup from code-behind with the following:

然后我可以使用以下代码从代码隐藏调用模式弹出窗口:

   protected void buttonName_Click(object sender, EventArgs e) {   
      ScriptManager.RegisterStartupScript(this,this.GetType(),"Pop", "openModal();", true);
    }

#1