Javascript 警告破坏了我的 asp.NET Web 应用程序的布局

Question

I know there is a similar question, but that answer did not solve my problem.

This is how my application looks normally:

And this is how it looks after a Javascript alert (width of menu items gets screwed, the purple bar on the left has an extra part added to it on top):

This is the code I am using to call an alert:

    private void Alert(string msg)
    {
        Response.Write("<script language = 'javascript'>window.alert('" + msg + "')</script>");
    }

Did anyone ever had this problem, I had something similar even with the default asp.NET design. How can I fix this? I am using IE 7 by the way, it's ok on Firefox.

Update:

Fixed the issue with the purple bar, removed a margin. Still figuring out the menu width issue.

This is my CSS:

#menu
{
   position: absolute;
   left: 78%;
   top: 108px;
   width: 170px !important;  
}

div.menu
{
   padding: 4px 0px 4px 8px;
}

div.menu ul
{
   list-style: none;
   margin: 0px;
   padding: 0px;
   width: auto;
}

div.menu ul li a, div.menu ul li a:visited
{
   background-color: #FFF; /*680840*/
   border: 1px #4e667d solid;
   height: 20px;
   width: 140px;
   color: #000; /*FFF*/
   display: block;
   line-height: 1.35em;
   padding: 4px 20px;
   text-decoration: none;
   white-space: nowrap;
}

div.menu ul li a:hover
{
   background-color: #680840;
   color: #FFF;
   text-decoration: none;
}

.selectedMenu
{
   background-color: #680840;
   color: #FFF;
   text-decoration: none;
}

div.menu ul li a:active
{
   background-color: #680840;
   color: #cfdbe6;
   text-decoration: none;
}

Update For @Sassyboy:

Front-End:

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <asp:HiddenField Value="" ID="errorMessageHidden" runat="server"/>
    <script type="text/javascript">
        var alertMsg = document.getElementById('errorMessageHidden'); 
        if (alertMsg != null) alert(alertMsg); 
    </script>

and c# I add this:

errorMessageHidden.Value = "Failed to Select - Test";

Answer 1

This is becuase Response.Write often is rendered before the HTML of the page - look at the source of your page.

There are better ways of adding Javascript to the page, look up ClientScriptManager .

Answer 2

Response.Write will add to response before the HTML of the page and this leads to issues similar to what you mentioned.

There are multiple other ways in which the functionality you are trying to achieve can be achieved. eg you could have a hidden field hdnAlertMessage and set its value with the message you want to alert. And then check on the client side if the hidden field has a value then alert that value.

So on your server side

hdnAlertMessage.Value = message;

And on your client side

var alertMsg = document.getElementById('hdnAlertMessage');

if (alertMsg != null)
    alert(alertMsg.value);

Or something along those lines.

Edited: alert(alertMsg) to alert(alertMsg.value)