We Keep Coding

jquery load event not triggering on iframe when loading pdf - Even when it does trigger fine in seperate project

I am having a very weird problem that I cannot figure out. I am trying to add a loading dialog box to a page that generates a pdf. I coded the web page in a separate project, and the dialog box worked perfectly. But when I included the extremely basic jquery-ui code into my existing website project, it doesn't work. Specifically, the popup doesn't go away when the PDF loads into the iframe. Basically the .load(function()) event isn't triggering.
But the event triggers just fine in my separate project. I generate the exact same pdf using the exact same data and code, and it works fine. But when put into my main project, the load event doesn't trigger.
Here is my code. The company I work for still uses webforms so ...
Code that isn't triggering
$(function () {
$("[id$=ifPDF]").load(function () {
hideDialog();
});
});
If you guys could help me find the conflict, it would be greatly appreciated
nice.aspx
<%# Page Title="" Language="C#" MasterPageFile="~/main.master" AutoEventWireup="true" CodeFile="nice.aspx.cs" Inherits="letters_missed_appointment_nice" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
<link rel="stylesheet" type="text/css" href="\resources\css\letters.css" />
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<style type="text/css">
#dialog {
display: none;
}
</style>
<script type="text/javascript">
function showDialog() {
$("#dialog").dialog();
}
function hideDialog() {
$("#dialog").dialog("close");
}
$(function () {
$("[id$=ifPDF]").load(function () {
hideDialog();
});
});
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="pageHeader" Runat="Server">
Cabinet
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="pageContent" Runat="Server">
<h1>Nice Letter</h1>
<h3>Enter in the information below and click "Create Letter".</h3>
<asp:UpdatePanel ID="upMain" runat="server">
<ContentTemplate>
<table>
<tr>
<td>Letter Date: </td>
<td><asp:TextBox ID="txtLetterDate" runat="server"></asp:TextBox> </td>
<td>Recipient Name: </td>
<td><asp:TextBox ID="txtRecipientName" runat="server"></asp:TextBox></td>
</tr>
<tr>
<td>Appointment Date: </td>
<td><asp:TextBox ID="txtAppointmentDate" runat="server"></asp:TextBox> </td>
<td>Patient Name: </td>
<td><asp:TextBox ID="txtPatientName" runat="server"></asp:TextBox></td>
</tr>
<tr><td> </td></tr>
<tr>
<td><asp:Button ID="cmdCreateLetter" Text="Create Letter" OnClientClick="showDialog();" runat="server" /></td>
</tr>
</table>
<br />
<iframe id="ifPDF" visible="false" runat="server" />
<div id="dialog" title="Loading PDF">Loading PDF, Please Wait ...</div>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
nice.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class letters_missed_appointment_nice : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
ifPDF.Attributes["class"] = "pdf_view";
cmdCreateLetter.Click += new EventHandler(Load_PDF);
}
protected void Load_PDF(object sender, EventArgs e)
{
ifPDF.Visible = true;
PDFGenerator my_doc = new PDFGenerator();
my_doc.Template = Server.MapPath("nice_letter.html");
my_doc.Add("letter_date", txtLetterDate.Text);
my_doc.Add("recipient_name", txtRecipientName.Text);
my_doc.Add("patient_name", txtPatientName.Text);
my_doc.Add("appointment_date", txtAppointmentDate.Text);
byte[] doc_array = my_doc.CreateDocument(base_url: Server.MapPath("/letters/missed_appointment/"));
string b64_doc = Convert.ToBase64String(doc_array, 0, doc_array.Length);
string pdf_src = $"data:application/pdf;base64,{b64_doc}";
ifPDF.Attributes["Src"] = pdf_src;
}
}
letters.css
body > form > main {
width: 80%;
margin-left: auto;
margin-right: auto;
padding-top: 5px;
min-height: 800px;
}
body > form > footer {
position: static;
padding-bottom: 50px;
}
.pdf_view {
width: 100%;
height: 700px;
border: none;
}
main.css
body {
margin: 0px;
background-color: #e7e7de;
font-family: 'Roboto', sans-serif;
}
body > form > #pageGreeting {
width: calc(100%-20px);
padding-top: 10px;
padding-bottom: 10px;
padding-left: 20px;
background-color: #0f3057;
box-shadow: 0px 4px 15px -1px #000000;
}
body > form > #pageGreeting > #pageTitle {
font-size: 35px;
font-weight: 700;
color: #e7e7de;
font-family: 'Courgette', cursive;
}
body > form > #pageGreeting > nav {
display: inline-block;
margin-left: 30px;
font-size: 20px;
border-left: 3px solid #e7e7de;
padding-left: 30px;
}
body > form > #pageGreeting > nav > span {
display: inline-block;
margin-left: 10px;
border-left: 1px solid #e7e7de;
border-right: 1px solid #e7e7de;
padding-left: 10px;
padding-right: 10px;
}
body > form > #pageGreeting > nav > span:first-child {
margin-left: 0px;
border-left: none;
}
body > form > #pageGreeting > nav > span:last-child {
border-right: none;
}
body > form > #pageGreeting > nav > span > a {
color: aqua;
text-decoration: none;
font-weight: 900;
font-size: 25px;
}
body > form > #pageGreeting > nav > span > a:hover {
color: blue;
}
body > form > main {
width: 100%;
background-color: #e7e7de;
min-height: 600px;
margin-top: 15px;
}
body > form > main > h1 {
display: block;
margin-left 15px;
}
body > form > footer {
position: absolute;
bottom: 0px;
width: 100%;
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
font-family: Arial;
font-size: 15px;
font-weight: 900;
background-color: #00597a;
color: white;
}
div.pageDescription {
width: 100%;
padding-top: 10px;
padding-bottom: 20px;
font-size: 30px;
text-align: center;
font-weight: 700;
}
main.master
<%# Master Language="C#" AutoEventWireup="true" CodeFile="main.master.cs" Inherits="main" %>
<!DOCTYPE html>
<html>
<head runat="server">
<title></title>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Courgette&family=Roboto:wght#300&display=swap" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="resources/css/main.css" />
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="frmMain" runat="server">
<asp:ScriptManager ID="smMain" runat="server"></asp:ScriptManager>
<div id="pageGreeting">
<span id="pageTitle"><asp:ContentPlaceHolder ID="pageHeader" runat="server"></asp:ContentPlaceHolder></span>
<nav><% WriteNav(); %></nav>
</div>
<main><asp:ContentPlaceHolder ID="pageContent" runat="server"></asp:ContentPlaceHolder></main>
<footer>Copyright © 2022 Renewed Life Chiropractic Center - All Rights Reserved</footer>
</form>
</body>
</html>

you have probably a block from browser "cors", check for block messages on developers console (f12) or any error messages you'd probably have to send a headers to allow show the iframe in a "parent" page

I think the ID of your iframe is changed on rendering, because you use the 'runat="server"' attribute. That's why javascript doesn't find this control by ID.
Try setting clientidmode tot static, like this:
<iframe id="ifPDF" visible="false" runat="server" ClientIDMode="Static" />

css code not working in mvc apart from background image

some css code aren't working with my mvc website
I have created a Layout which linked to the css file. A view page is using that Layout. When i load the page, It know how to get the background image but some simple code doesn't work. I also found out adding the headers into my text class from css worked but other class don't. Tried to use the css file directly without the layout, result in the same way. Please let me know if more information is needed. i appreciate any kind of help, Thank you
CSS Code aren't working
h2{
font-size: 35px
}
nav {
margin: 0px auto;
width: 100%;
height: 50px;
background-color: white;
float: left;
padding: 10px;
border: 2px solid red;
position: relative;
z-index: 10;
}
working css code
body {
font-family: verdana, sans-serif;
background-image: url('/Images/pawwallpaper.jpg')
}
.text {
text-align: center;
font-size: 35px;
padding: 10px 16px;
position: absolute;
bottom: 10px;
color: #FC5A37;
font-weight: bold;
}
view that is using the Layout
#model ToysListViewModel
<h1>#Model.CurrentCategory</h1>
#foreach (var toy in Model.Toys)
{
<nav> <!--change this to <div class="text"> worked -->
<center>
<img src="#toy.ImageUrl" alt="" height="420" width="420" />
<h2>#toy.Name</h2>
<h3>#toy.Price.ToString("c")</h3>
<h4>#toy.Category.CategoryName</h4>
<p>#toy.ShortDescription</p>
</center>
</nav>
}
The layout
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap.4.1.3/css/bootstrap.min.css">
<link href="~/Content/site.css" type="text/css" rel="stylesheet" />
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=dive-width, initail-scale=1" />
<title>Tigerpaw</title>
</head>
<body>
<div>
#RenderBody()
</div>
</body>
</html>

Do you try adding id?
<div id="test">
<h1>#Model.CurrentCategory</h1>
#foreach (var toy in Model.Toys)
{
<nav> <!--change this to <div class="text"> worked -->
<center>
<img src="#toy.ImageUrl" alt="" height="420" width="420" />
<h2>#toy.Name</h2>
<h3>#toy.Price.ToString("c")</h3>
<h4>#toy.Category.CategoryName</h4>
<p>#toy.ShortDescription</p>
</center>
</nav>
}
</div>
#test h2{
font-size: 35px
}
#test nav {
margin: 0px auto;
width: 100% ;
height: 50px;
background-color: white;
float: left;
padding: 10px;
border: 2px solid red;
position: relative;
z-index: 10;
}
If you don't want any new values ​​to be corrupted, you should use !important.

your css are not useful because of using bootstrap library but if you want to use them without adding a class or id to your attributes you need to add !important to your css codes like below :
h2
{
font-size: 35px !important;
}

Where to place Form (server side) tag so that it will not effect CSS of web page?

I have created a master page with header, footer, and container(for content of other pages). Footer has a 'asp.net link button' which requires <form id="form1" runat="server">. Now I have to add content in 'content page' such as 'asp buttons' 'links' etc. But 'IIS' generates error that
'a webpage can have only one server side tag.'
In master-page, I've placed <form id="form1" runat="server">under the <div class="footer-right"> tag and if I try to move <form id="form1" runat="server"> to the top of page or any where else, the CSS of search bar gets vanished. How to resolve this issue?
if I place 'form tag' on the top of page after body tag.
here is my code
master-page
<%# Master Language="C#" AutoEventWireup="true" CodeBehind="Site1.master.cs" Inherits="WebApplication2.Site1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<meta name="keywords" content="footer, search, form, icons" />
<title>Homepage</title>
<%--<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>--%>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="css/demo.css"/>
<link rel="stylesheet" href="css/footer-distributed-with-search.css"/>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
<style>
body {
margin: 0;
font-family: Arial;
}
.topnav {
overflow: hidden;
background-color: #37312f;
padding: 12px 14px;
font-family:sans-serif;
font-weight:bold;
}
.topnav a {
float: left;
color: #f2f2f2;
text-align: center;
padding: 12px 14px;
text-decoration: none;
font-size: 17px;
}
.topnav a.logo {
font-size: 25px;
font-weight: bold;
color: #fff;
height: 12px;
margin-left: 72px;
}
.topnav-right {
float: right;
}
.active {
background-color: #4CAF50;
color: white;
}
.topnav .icon {
display: none;
}
.dropdown1 {
float: left;
overflow: hidden;
}
.dropdown1 .dropbtn {
font-size: 17px;
border: none;
outline: none;
color: white;
padding: 12px 14px;
background-color: inherit;
font-family: inherit;
margin: 0;
}
.dropdown1-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: -de1;
}
.dropdown1-content a {
float: none;
color: black;
padding: 12px 14px;
text-decoration: none;
display: block;
text-align: left;
}
.topnav a:hover, .dropdown1:hover .dropbtn {
background-color: #555;
color: white;
}
.dropdown1-content a:hover {
background-color: #ddd;
color: black;
}
.dropdown1:hover .dropdown1-content {
display: block;
}
#media screen and (max-width: 600px) {
.topnav a:not(:first-child), .dropdown1 .dropbtn {
display: none;
}
.topnav a.icon {
float: right;
display: block;
}
}
#media screen and (max-width: 600px) {
.topnav.responsive {
position: relative;
}
.topnav.responsive .icon {
position: absolute;
right: 0;
top: 0;
}
.topnav.responsive a {
float: none;
display: block;
text-align: left;
}
.topnav.responsive .dropdown1 {
float: none;
}
.topnav.responsive .dropdown1-content {
position: relative;
}
.topnav.responsive .dropdown1 .dropbtn {
display: block;
width: 100%;
text-align: left;
}
}
</style>
</head>
<body>
<div class="topnav" id="myTopnav">
Website Name
<div class="topnav-right">
Home
<div class="dropdown1">
<button class="dropbtn">
Tools
<i class="fa fa-caret-down"></i>
</button>
<div class="dropdown1-content">
Link 1
Link 2
Link 3
</div>
</div>
About Us
Contact
Login
Sign Up
<%--Dropdown bar for window resize--%>
☰
</div> <%--id="Topnav-right--%>
</div> <%--id="myTopnav--%>
<script>
function myFunction() {
var x = document.getElementById("myTopnav");
if (x.className === "topnav") {
x.className += " responsive";
} else {
x.className = "topnav";
}
}
</script>
<!-- The content of your page would go here. -->
<div class="container" style="background-color:aquamarine">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
<footer class="footer-distributed">
<div class="footer-left">
<p class="footer-links">
Home
·
About us
·
Contact
·
Login
·
Sign up
·
Feedback
</p>
<p class="footer-company-name">websiteName © 2019</p>
</div>
<div class="footer-right">
<form id="form2" runat="server" method="get" action="#">
<input placeholder="Search our website" name="search" /><asp:LinkButton runat="server" ID="btnSubmit" class="btn btn-mini" OnClick="Page_Load">
<i class="fa fa-search" aria-hidden="true"></i></asp:LinkButton>
<%--<i class="fa fa-search"></i>--%>
</form>
</div>
</footer>
</body>
</html>
Content-page
<%# Page Title="" Language="C#" MasterPageFile="~/Site1.Master" AutoEventWireup="true" CodeBehind="WebForm5555555555555555.aspx.cs" Inherits="WebApplication2.WebForm5555555555555555" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<%--<form is="form1" runat="server">--%>
<div class="row">
<div class="col-sm-4" style="background-color:lavender;">
<asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton>.col-sm-4</div>
<div class="col-sm-4" style="background-color:lavenderblush;">.col-sm-4</div>
<div class="col-sm-4" style="background-color:lavender;">.col-sm-4</div>
</div>
<h2>Responsive Topnav with Dropdown</h2>
<p>Resize the browser window to see how it works.</p>
<p>Hover over the dropdown button to open the dropdown menu.</p>
<%-- </form>--%>
</asp:Content>
footer-distributed-with-search.css
.footer-distributed{
background-color: #292c2f;
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12);
box-sizing: border-box;
width: 100%;
font: bold 16px sans-serif;
text-align: left;
padding: 50px 60px;
margin-top: 80px;
overflow: hidden;
}
/* Footer left */
.footer-distributed .footer-left{
float: left;
}
.footer-distributed .footer-links{
color: #ffffff;
margin: 0 0 10px;
padding: 0;
}
.footer-distributed .footer-links a{
display:inline-block;
line-height: 1.8;
text-decoration: none;
color: inherit;
}
.footer-distributed .footer-company-name{
color: #8f9296;
font-size: 14px;
font-weight: normal;
margin: 0;
}
/* Footer right */
.footer-distributed .footer-right{
float: right;
}
/* The search form */
.footer-distributed form{
position: relative;
}
.footer-distributed form input{
display: block;
border-radius: 3px;
box-sizing: border-box;
background-color: #1f2022;
box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.1);
border: none;
font: inherit;
font-size: 14px;
font-weight: normal;
color: #d1d2d2;
width: 500px;
padding: 18px 50px 18px 18px;
}
.footer-distributed form input:focus{
outline: none;
}
/* Changing the placeholder color */
.footer-distributed form input::-webkit-input-placeholder {
color: #5c666b;
}
.footer-distributed form input::-moz-placeholder {
opacity: 1;
color: #5c666b;
}
.footer-distributed form input:-ms-input-placeholder{
color: #5c666b;
}
/* The magnify glass icon */
.footer-distributed form i{
width: 18px;
height: 18px;
position: absolute;
top: 16px;
right: 18px;
color: #d1d2d2;
font-size: 18px;
}
/* If you don't want the footer to be responsive, remove these media queries */
#media (max-width: 1000px) {
.footer-distributed form input{
width: 300px;
}
}
#media (max-width: 800px) {
.footer-distributed{
padding: 30px;
text-align: center;
font: bold 14px sans-serif;
}
.footer-distributed .footer-company-name{
margin-top: 10px;
font-size: 12px;
}
.footer-distributed .footer-left,
.footer-distributed .footer-right{
float: none;
max-width: 300px;
margin: 0 auto;
}
.footer-distributed .footer-left{
margin-bottom: 20px;
}
.footer-distributed form input{
width: 100%;
}
}
CSS template I've used
Beautiful and Responsive Footer Templates

In your case, the style sheets included in your master page are using relative paths. Specify your style sheet links with runat=server and prefix them with the virtual web root path (~).
An example:
<link rel="stylesheet" href="~/css/demo.css" runat="server"/>
<link rel="stylesheet" href="~/css/footer-distributed-with-search.css" runat="server"/>
Do this for all your style sheets on your page (obviously not the CDN links) and place your <form> after <body> and please ensure that the <head> element also needs to be runat=server. Using the virtual web root path (~) will work when you publish your site in a virtual directory so you don't encounter problems as such.

appearing of an <li> when accessing other page in master page

I'm facing a problem when I login with a username and a password then, redirected to the homepage the login button appears again in all pages where as it must be hidden until I logout. so what I want is when I click loginbutton it redirects me to the homepage but the login in <ul> must be disappeared I tried saving data in a cookie but it doesn't work.
int a = 0;
string username = "";
string random = RandomString(26);
body,
div,
p {
margin: 20px;
background-color: #e410d5;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
.clear {
clear: both;
}
.content {
width: 50%;
/* background-color: rgb(254,254,254);*/
border: 8px solid #ffd800;
border-radius: 15px 15px 15px 15px;
float: left;
background-color: #b314c5;
margin-left: 420px;
margin-top: 20px;
margin-bottom: 100px;
min-height: 220px;
position: absolute;
}
.menu {
/* background-color:rgb(10,110,178);*/
width: 60%;
margin-left: 590px;
padding: 0px;
height: 40px;
color: rgb(243, 243, 243);
border-radius: 5px 5px 5px 5px;
position: center;
margin-top: -7px;
}
.menu ul li {
float: left;
display: block;
list-style: none;
/*border-right: 1px solid rgb(10,85,125);
border-left: 1px solid rgb(67,153,253);*/
}
.menu ul li:hover {
background-color: #59058a;
border-right: 1px solid #e410d5;
}
.menu ul li a {
font-size: 13px;
font-weight: bold;
line-height: 40px;
padding: 8px 20px;
/*color:rgb(255,255,255);*/
text-decoration: none;
}
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>
<asp:ContentPlaceHolder ID="title" runat="server"></asp:ContentPlaceHolder>
</title>
<link href="Styles/StyleSheet.css" rel="stylesheet" />
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
<style type="text/css">
.auto-style1 {
height: 241px;
}
</style>
</head>
<body>
<form id="form1" runat="server" class="auto-style1">
<div class="wrapper">
<div class="menu">
<nav>
<ul>
<li>Home
</li>
<li id="loginlist" runat="server">Login
</li>
<li>Contact Us
</li>
<li>About Us
</li>
</ul>
</nav>
</div>
<div class="clear"></div>
<div class="content">
<asp:ContentPlaceHolder id="contentbody" runat="server">
</asp:ContentPlaceHolder>
</div>
<div class="clear">
</div>
</div>
</form>
</body>
</html>
//////////// DECLRATIONS GOES HERE /////////////////////
using (SqlConnection sqlConnection = new SqlConnection("Data Source=(local);Database='Task_Management';Integrated Security=yes;"))
{
sqlConnection.Open();
string query = "Select Emp_ID FROM dbo.Employees where Emp_ID ='" + this.UserNameTextBox.Text +"'and Emp_Password='"+ this.PasswordTextBox.Text + "'";
using (SqlCommand sqlCommand = new SqlCommand(query, sqlConnection))
{
try
{
SqlDataReader readeenter code herer = sqlCommand.ExecuteReader();
if (reader.Read())
{
string treatment = reader[0].ToString();
username = treatment;
//Cookies for each user to be signed in or logout
Response.Cookies[username].Value = UserNameTextBox.Text;
Response.Cookies[username].Expires = DateTime.Now.AddDays(1);
Label2.Text = UserNameTextBox.Text;
if (Response.Cookies[username].Value == UserNameTextBox.Text)
{
message();
var ctrl = this.Master.FindControl("loginlist"); // loginlist is the id of the login <li> in the master page
ctrl.Visible = false;
Response.Redirect("HomePage.aspx");
}
// returns 1 if the loged in user is not an admin else it returns 0
a = 1;
}
}
catch (Exception f)
{
// Exception goes here
}
}
return a;
}

Write a js code in your master page.
**Note Dowload jquery.cookie plugins
$(document).read(function(i,val){
try
{
if($.cookie["username"]!="")
{
$("#loginlist").hide();
}
else
{
$("#loginlist").show();
}
}
catch($ms)
{
$("#loginlist").show();
}
});

Take a look at the LoginView control. This allows you to show different things based on if someone is logged in or if they are anonymous.
MSDN documentation
<asp:LoginView ID="LoginView1" runat="server">
<AnonymousTemplate>
<%-- Show Login option --%>
<ul>
<li>Home</li>
<li id="loginlist" runat="server">Login</li>
<li>Contact Us</li>
<li>About Us</li>
</ul>
</AnonymousTemplate>
<LoggedInTemplate>
<%-- Don't show Login option --%>
<ul>
<li>Home</li>
<li>Contact Us</li>
<li>About Us</li>
</ul>
</LoggedInTemplate>
</asp:LoginView>

This is because of using Response.Redirect method .it will send you another page before end of execution of current page .there is another overload that accept boolean and you must send false to it.
Response.Redirect("HomePage.aspx",false);
but still it will not work .i don't know why but you can , in login page use redirect method and hide the control at home page .
At Home Page
var ctrl = this.Master.FindControl("loginlist");
ctrl.Visible = false;
At Login Page
Response.Redirect("HomePage.aspx");
More information
When Should I Use Response.Redirect(url, true)?

Master Page in Visual Studio 2012 doesn't want to load in web browser

I am trying to build a master page for a website in ASP.NET, and after several trials, I couldn't display the page in my web browser. I have changed browsers thinking that source of the problem might be that. However the same problem is occurring: I get exactly a blank page without anything on it: In the designer of visual Studio, I can see a sample view of how the website will look like (I have all the files needed for the pictures of the background and the profile picture.)
What might be the problem?
<%# Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
<link href="/normalize.css" rel="stylesheet">
<style>
header {
text-align: center;
background-image: url("/Pictures/Harvard-widerBlurred.jpg");
background-size: cover;
color: white;
}
a {
color: white;
}
h1 {
font-size: 70px;
}
img {
margin: 40px 0px 0px 0px;
border: 7px solid white;
border-radius: 20px;
}
ul {
padding: 10px;
background: rgba(0,0,0,0.5);
}
li {
display: inline;
padding: 0px 10px 0px 10px;
}
article{
max-width: 500px;
padding: 20px;
margin: 0 auto;
}
#media (max-width: 500px){
li{
display: block;
padding: 5px;
}
h1{
font-size: 36px;
}
body {
background: red;
}
}
</style>
<header>
<img src="/Pictures/GoExchangelogo.jpg">
<h1>GoExchange!</h1>
<ul>
<li>AboutUs</li>
<li>My Appointment</li>
<li>My Application</li>
</ul>
</header>
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
Thank you