How to change the font style and size on the entire Aspx page programatically

T

technoGirl

hey guys, I know it's crazy how I'm working over xmas...but oh well
here I go:

In my ASP.Net app (1.1), I want the user to be able to select font
(such as Bold, Italic, underline) and stuff like that from a dropdown
list) and then I wanna apply these properties to all my page (all
text). Now I'm doing something like this:

string font = string.Empty;
switch(ddl2.SelectedItem.Text)
{
case "Bold":


font = Convert.ToString(System.Drawing.FontStyle.Bold);

break;

case "Italic":
font = Convert.ToString(System.Drawing.FontStyle.Italic);
break;

}
myBody.Attributes.Add("Font", font);
Session["theColor"] = font;

This worked for changing the color of the entire page as I hard coded
the colors hexa decimal values in the cases, but here these are enums,
and can only be compared.

Anyways does anyone has any input on this???? I want this to happen
when the user select from the DDL and on the button click event it
should change the font.

Thanks
Tina
 
M

marss

technoGirl said:
myBody.Attributes.Add("Font", font);

Most correct syntax:
int fontSize = 14;
bool bold = true;
bool italic = true;

myBody.Style["font-size"] = fontSize.ToString();
myBody.Style["font-weight"] = (bold ? "bold" : "normal");
myBody.Style["font-style"] = (italic ? "italic" : "normal");

But if you do it in this way you can face with some problem.
Your font settings do not applied to any text contained within tables.
So try solve your tast in a different way. Place next code in
Page_Load:

if (!IsClientScriptBlockRegistered("Font Styles"))
{
int fontSize = 14;
bool bold = true;
bool italic = true;

string style =
string.Format(@"font-size:{0};font-weight:{1};font-style:{2};",
fontSize,
bold ? "bold" : "normal",
italic ? "italic" : "normal");

style = @"<style> body, td {" + style + " }</style>";

RegisterClientScriptBlock("Font Styles", style);
}

Maybe it helps.
 
T

technoGirl

Hello Marss, thanks for the response. I was wondering if there's
another way without using the client side Javescript. I mean ideally
I'd like to do this on the server side using external CSS or just the
<style> element within html head.

THanks
Tina

technoGirl said:
myBody.Attributes.Add("Font", font);Most correct syntax:
int fontSize = 14;
bool bold = true;
bool italic = true;

myBody.Style["font-size"] = fontSize.ToString();
myBody.Style["font-weight"] = (bold ? "bold" : "normal");
myBody.Style["font-style"] = (italic ? "italic" : "normal");

But if you do it in this way you can face with some problem.
Your font settings do not applied to any text contained within tables.
So try solve your tast in a different way. Place next code in
Page_Load:

if (!IsClientScriptBlockRegistered("Font Styles"))
{
int fontSize = 14;
bool bold = true;
bool italic = true;

string style =
string.Format(@"font-size:{0};font-weight:{1};font-style:{2};",
fontSize,
bold ? "bold" : "normal",
italic ? "italic" : "normal");

style = @"<style> body, td {" + style + " }</style>";

RegisterClientScriptBlock("Font Styles", style);

}Maybe it helps.
 
M

marss

technoGirl said:
Hello Marss, thanks for the response. I was wondering if there's
another way without using the client side Javescript.

Hello, Tina
Don't give attention to RegisterClientScriptBlock - this is only means
to place styles in the page (lacking something better).
I mean ideally
I'd like to do this on the server side using external CSS or just the
<style> element within html head.

If you want to place styles in head of html document you can use next
trick:
aspx:
<head>
<title></title>
<%= GetStyles() %>
</head>

code:
protected string GetStyles()
{
return @"<style>
.....
</style>";
}

In ASP.Net 2.0 method Header.StyleSheet.RegisterStyle allows to
register style for classes but I'm not sure whether it can be used to
register style for elements (body, td, etc).
Maybe there is a better method to implement this functionality, I'm
interested to know too.
 
T

technoGirl

hey Marrs, thanks for your response. Sorry about the delay, I was out
of town. It worked just fine. I actually ended up using =GetStyle
method you mentioned. A sample is out on
http://samples.gotdotnet.com/quicks...s1/cookies1.src&file=CS\Customize.aspx&font=3
page. It's working and everything just fine. But the page only
updates the info when you click the submit button twice. In the button
click events handler. Do you know who this might be happening???

Following is the code they are using at the link above:

public void btnSubmit_Click(object sender, System.EventArgs e)
{
HttpCookie cookie = new HttpCookie("preferences1");
cookie.Values.Add("ForeColor",ForeColor.SelectedItem.Value);
cookie.Values.Add("BackColor",BackColor.SelectedItem.Value);
cookie.Values.Add("LinkColor",LinkColor.SelectedItem.Value);
cookie.Values.Add("FontSize",FontSize.SelectedItem.Value);
cookie.Values.Add("FontName",FontName.SelectedItem.Value);

Response.AppendCookie(cookie);

if ( ViewState["Referer"] != null )
{
Response.Redirect(ViewState["Referer"].ToString());
}
}
 
T

technoGirl

hey Marrs, thanks for your response. Sorry about the delay, I was out
of town. It worked just fine. I actually ended up using =GetStyle
method you mentioned. A sample is out on
http://samples.gotdotnet.com/quicks...s1/cookies1.src&file=CS\Customize.aspx&font=3
page. It's working and everything just fine. But the page only
updates the info when you click the submit button twice. In the button
click events handler. Do you know who this might be happening???

Following is the code they are using at the link above:

public void btnSubmit_Click(object sender, System.EventArgs e)
{
HttpCookie cookie = new HttpCookie("preferences1");
cookie.Values.Add("ForeColor",ForeColor.SelectedItem.Value);
cookie.Values.Add("BackColor",BackColor.SelectedItem.Value);
cookie.Values.Add("LinkColor",LinkColor.SelectedItem.Value);
cookie.Values.Add("FontSize",FontSize.SelectedItem.Value);
cookie.Values.Add("FontName",FontName.SelectedItem.Value);

Response.AppendCookie(cookie);

if ( ViewState["Referer"] != null )
{
Response.Redirect(ViewState["Referer"].ToString());
}
}
 
M

marss

Hi, Tina,

Change :

String GetStyle(String key)
{
HttpCookie cookie = Request.Cookies["preferences1"];
......

with
String GetStyle(String key)
{
HttpCookie cookie = Response.Cookies["preferences1"];
......
 
T

technoGirl

Hello Marrs, well I did try replacing the Request.Cookies with
Response.Cookies. But it still requires clicking the submit button
twice?? If you look at the button click event handler's code above (or
in the sample link I posted) it shouldn't be doing that. Or is there
anything that I'm not aware of????????

Thanks for all your help.
 
M

marss

technoGirl said:
Hello Marrs, well I did try replacing the Request.Cookies with
Response.Cookies. But it still requires clicking the submit button
twice?? If you look at the button click event handler's code above (or
in the sample link I posted) it shouldn't be doing that. Or is there
anything that I'm not aware of????????

Hi, Tina
I copied code from the link you posted, and I made only change in
GetStyle method (Response insted of Request). Everything works fine for
me. It's hard for me to say what causes your problem. I post code with
my correction below.

<html>

<script language="C#" runat="server">

void Page_Load(Object sender, EventArgs E) {

if (!IsPostBack){
HttpCookie cookie = Request.Cookies["preferences1"];
ViewState["Referer"] = Request.Headers["Referer"];

if ( cookie != null ){
BackColor.Value = (String)cookie.Values["BackColor"];
ForeColor.Value = (String)cookie.Values["ForeColor"];
LinkColor.Value = (String)cookie.Values["LinkColor"];
FontSize.Value = (String)cookie.Values["FontSize"];
FontName.Value = (String)cookie.Values["FontName"];
}
}
}

void Submit_Click(Object sender, EventArgs E) {

HttpCookie cookie = new HttpCookie("preferences1");
cookie.Values.Add("ForeColor",ForeColor.Value);
cookie.Values.Add("BackColor",BackColor.Value);
cookie.Values.Add("LinkColor",LinkColor.Value);
cookie.Values.Add("FontSize",FontSize.Value);
cookie.Values.Add("FontName",FontName.Value);
Response.AppendCookie(cookie);

if ( ViewState["Referer"] != null ){
Response.Redirect(ViewState["Referer"].ToString());
}
}

void Cancel_Click(Object sender, EventArgs E) {
if ( ViewState["Referer"] != null ){
Response.Redirect(ViewState["Referer"].ToString());
}
}

String GetStyle(String key) {

HttpCookie cookie = Response.Cookies["preferences1"];

if (cookie != null) {

switch (key) {

case "ForeColor" :
return cookie.Values["ForeColor"];
break;

case "BackColor" :
return cookie.Values["BackColor"];
break;

case "LinkColor" :
return cookie.Values["LinkColor"];
break;

case "FontSize" :
return cookie.Values["FontSize"];
break;

case "FontName" :
return cookie.Values["FontName"];
break;
}
}
return "";
}

</script>

<style>

body {
font: <%=GetStyle("FontSize")%> <%=GetStyle("FontName")%>;
background-color: <%=GetStyle("BackColor")%>;
}

table {
font: <%=GetStyle("FontSize")%> <%=GetStyle("FontName")%>;
background-color: <%=GetStyle("BackColor")%>;
foreground-color: <%=GetStyle("ForeColor")%>
}

a { color: <%=GetStyle("LinkColor")%> }

</style>

<body style="color:<%=GetStyle("ForeColor")%>">

<form id="Form1" runat="server">

<h3><font face="Verdana">Customize This Page</font></h3>

<b>Select Your Preferences: </b><p>

<table style="color:<%=GetStyle("ForeColor")%>">
<tr>
<td>Background Color:</td>
<td>
<select id="BackColor" runat="server">
<option>beige</option>
<option>yellow</option>
<option>red</option>
<option>blue</option>
<option>lightblue</option>
<option>lightgreen</option>
<option>black</option>
<option>white</option>
</select>
</td>
</tr>
<tr>
<td>Foreground Color:</td>
<td>
<select id="ForeColor" runat="server">
<option>black</option>
<option>beige</option>
<option>yellow</option>
<option>red</option>
<option>blue</option>
<option>lightblue</option>
<option>lightgreen</option>
<option>white</option>
</select>
</td>
</tr>
<tr>
<td>Hyperlink Color:</td>
<td>
<select id="LinkColor" runat="server">
<option>blue</option>
<option>beige</option>
<option>yellow</option>
<option>red</option>
<option>lightblue</option>
<option>lightgreen</option>
<option>black</option>
<option>white</option>
</select>
</td>
</tr>
<tr>
<td>Font Size:</td>
<td>
<select id="FontSize" runat="server">
<option>8pt</option>
<option>10pt</option>
<option>12pt</option>
<option>14pt</option>
</select>
</td>
</tr>
<tr>
<td>Font Name:</td>
<td>
<select id="FontName" runat="server">
<option>verdana</option>
<option>tahoma</option>
<option>arial</option>
<option>times</option>
</select>
</td>
</tr>
</table>

<p>

<input id="Submit1" type="submit" OnServerClick="Cancel_Click"
Value="Cancel" runat="server"/>
<input id="Submit2" type="submit" OnServerClick="Submit_Click"
Value="Submit" runat="server"/>

</form>

</body>
</html>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,731
Messages
2,569,432
Members
44,832
Latest member
GlennSmall

Latest Threads

Top