944,216 Members | Top Members by Rank

Web Development > Web Design > HTML and CSS > form menu style sheet changer
Ad:
You are currently viewing page 1 of this multi-page discussion thread
Permalink
Jan 25th, 2007
0

form menu style sheet changer

Expand Post »
Hi all, how, using asp, can i make a form menu change the style sheet loaded, when it is clicked on, then refresh and page, and create a cookie which tells the browser which style sheet to load for that user when they next enter the website?

Thanks,

Max.
Reputation Points: 32
Solved Threads: 3
Posting Whiz in Training
MaxMumford is offline Offline
228 posts
since Oct 2006
Permalink
Jan 25th, 2007
0

Re: form menu style sheet changer

Put something like this in the head of every page: (note: you only really need the bold part in the code of the page with the form/that changes the cookie)

<%
var style = new String(Request.Cookies('style'));
if(style==null || style=='undefined'){
  style = new String(Request.Forms('style'));
  if(style==null || style=='undefined'){
   style="default";
  }else{
   Response.Cookies('style') = style;
  }
}
%>
<link rel="stylesheet" type="text/css" href="/styles/style_<%Response.write(style)%>.css"/>
I can't really test that atall; I can't run ASP anywhere.

The principle will work but some of the keywords words might be wrong... (is it Form or Forms?/Cookie or Cookies?) Also; it's not very secure or input-safe. A better way would be to use a keyword/enumeration in the cookie and form, and set the style variable to one of a list of the only allowable values.

For that code to work you'll need to set Javascript as the script language.
(put this line before the code)

HTML and CSS Syntax (Toggle Plain Text)
  1. <%@ LANGUAGE="JAVASCRIPT" %>
It'd almost be the same with VBScript; although I don't know how you'd test for a null string...
Last edited by MattEvans; Jan 25th, 2007 at 3:44 pm.
Moderator
Featured Poster
Reputation Points: 522
Solved Threads: 64
Veteran Poster
MattEvans is offline Offline
1,091 posts
since Jul 2006
Permalink
Jan 25th, 2007
0

Re: form menu style sheet changer

wow brilliant thanks! most people just put waffly replies with no real direction or instructions for newbies but urs was perfect! and thanks for the fast response! :cheesy: ill test it tomrrow its kidna late now so if any problems come up ill give u a buzz thanks a lot,

Max Mumford.
Reputation Points: 32
Solved Threads: 3
Posting Whiz in Training
MaxMumford is offline Offline
228 posts
since Oct 2006
Permalink
Jan 26th, 2007
0

Re: form menu style sheet changer

Hi, I have just tested it and there is one error. im not entirely sure what it is so go here to see the script in action.

http://grafax.co.uk/switch/

Below is the script for the page.

HTML and CSS Syntax (Toggle Plain Text)
  1. <%@ LANGUAGE="JAVASCRIPT"
  2. var style = new String(Request.Cookies('style'));
  3. if(style==null || style=='undefined'){
  4.   style = new String(Request.Forms('style'));
  5.   if(style==null || style=='undefined'){
  6.    style="default";
  7.   }else{
  8.    Response.Cookies('style') = style;
  9.   }
  10. }
  11. %>
  12. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a rel="nofollow" href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" target="_blank">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
  13. <html xmlns="<a rel="nofollow" href="http://www.w3.org/1999/xhtml" target="_blank"> http://www.w3.org/1999/xhtml</a> ">
  14. <head> 
  15. <link rel="stylesheet" type="text/css" href="/styles/style_<%Response.write(style)%>.css"/>
  16. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  17. <title>Untitled Document</title>
  18. </head>
  19. <body>
  20. <form id="form1" name="form1" method="post" action="">
  21.   <select name="style" id="style">
  22.     <option value="styles.css" selected="selected">1</option>
  23.     <option value="styles2.css">2</option>
  24.   </select>
  25. </form>
  26. </body>
  27. </html>
Last edited by MaxMumford; Jan 26th, 2007 at 4:30 am. Reason: style sheet attatch not in head
Reputation Points: 32
Solved Threads: 3
Posting Whiz in Training
MaxMumford is offline Offline
228 posts
since Oct 2006
Permalink
Jan 26th, 2007
0

Re: form menu style sheet changer

Ah; sorry. These two blocks shouldn't be combined:
HTML and CSS Syntax (Toggle Plain Text)
  1. <%@ LANGUAGE="JAVASCRIPT" %>
  2.  
  3. <% var style = new String(Request.Cookies('style'));
  4. if(style==null || style=='undefined'){
  5.   style = new String(Request.Forms('style'));
  6.   if(style==null || style=='undefined'){
  7.    style="default";
  8.   }else{
  9.    Response.Cookies('style') = style;
  10.   }
  11. }
  12. %>

You'll probably hit more errors now ^_-
Moderator
Featured Poster
Reputation Points: 522
Solved Threads: 64
Veteran Poster
MattEvans is offline Offline
1,091 posts
since Jul 2006
Permalink
Jan 26th, 2007
0

Re: form menu style sheet changer

The whole problem is that they won't keep things compatible.

We HAD a system where most web code was compatible. But then the elitists pounced, and decided that web code had to be more "elegant." Now we have a bifurcation between the newest browsers and the old ones.

There should be either a criminal penalty for introducing incompatibilities into a system that already works, or the person who introduced the incompatiblity should be forced to pay for the upgrade for everyone in the world.
Last edited by MidiMagic; Jan 26th, 2007 at 11:37 am.
Reputation Points: 730
Solved Threads: 181
Nearly a Senior Poster
MidiMagic is offline Offline
3,314 posts
since Jan 2007
Permalink
Jan 26th, 2007
0

Re: form menu style sheet changer

HTML and CSS Syntax (Toggle Plain Text)
  1. The whole problem is that they won't keep things compatible.
  2.  
  3. We HAD a system where most web code was compatible. But then the elitists pounced, and decided that web code had to be more "elegant." Now we have a bifurcation between the newest browsers and the old ones.
  4.  
  5. There should be either a criminal penalty for introducing incompatibilities into a system that already works, or the person who introduced the incompatiblity should be forced to pay for the upgrade for everyone in the world.

Has that got absolutely anything to do with this post, or did you intend it (the reply) to go elsewhere?

But anyway, assuming this is meant here:

ASP code will always be self-compatible because it doesn't matter how old a version of ASP you have on your server. ASP spits out HTML; and it can be as up-to-date or back-in-time as you (as the developer) so choses, If you update your ASP version, you only affect yourself.
Moderator
Featured Poster
Reputation Points: 522
Solved Threads: 64
Veteran Poster
MattEvans is offline Offline
1,091 posts
since Jul 2006
Permalink
Jan 26th, 2007
0

Re: form menu style sheet changer

Still not working :/ i have one stylesheet called styles.css which should be the default style sheet, i have another called styles2.css which is an alternate one. Is the code ok for that? Max

(new code..)

HTML and CSS Syntax (Toggle Plain Text)
  1. <%@ LANGUAGE="JAVASCRIPT" %>
  2. <% var style = new String(Request.Cookies('style'));
  3. if(style==null || style=='undefined'){
  4.   style = new String(Request.Forms('style'));
  5.   if(style==null || style=='undefined'){
  6.    style="default";
  7.   }else{
  8.    Response.Cookies('style') = style;
  9.   }
  10. }
  11. %>
  12. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a rel="nofollow" href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" target="_blank">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
  13. <html xmlns="<a rel="nofollow" href="http://www.w3.org/1999/xhtml" target="_blank"> http://www.w3.org/1999/xhtml</a> ">
  14. <head> 
  15. <link rel="stylesheet" type="text/css" href="/styles/style_<%Response.write(style)%>.css"/>
  16. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  17. <title>Untitled Document</title>
  18. </head>
  19. <body>
  20. <form id="form1" name="form1" method="post" action="">
  21.   <p>
  22.     <select name="style" id="style">
  23.       <option value="styles.css" selected="selected">1</option>
  24.       <option value="styles2.css">2</option>
  25.     </select>
  26. </p>
  27.   <p>
  28.     <input type="submit" name="Submit" value="Submit" />
  29. </p>
  30. </form>
  31. <p>&nbsp;</p>
  32. <h1>test heading1 set only in style.css (origional style) </h1>
  33. </body>
  34. </html>

do i need anything in the form action section? at the moment i have a submit button and thats all..
Last edited by MaxMumford; Jan 26th, 2007 at 5:44 pm.
Reputation Points: 32
Solved Threads: 3
Posting Whiz in Training
MaxMumford is offline Offline
228 posts
since Oct 2006
Permalink
Jan 26th, 2007
0

Re: form menu style sheet changer

HTML and CSS Syntax (Toggle Plain Text)
  1. href="/styles/style_<%Response.write(style)%>.css"

This bit means it will be looking in the /styles/ folder for a file called style_[X].css, where [X] is the value submitted in the field named 'style' from the form/cookie.

I think there's a problem with the null-string checking aswell; in the two places where it says style=='undefined' try: style==''; so:

if(style==null || style==''){
  style = new String(Request.Forms('style'));
  if(style==null || style==''){
   style="default";
  }else{
   Response.Cookies('style') = style;
  }
}
Moderator
Featured Poster
Reputation Points: 522
Solved Threads: 64
Veteran Poster
MattEvans is offline Offline
1,091 posts
since Jul 2006
Permalink
Jan 26th, 2007
0

Re: form menu style sheet changer

current code:

HTML and CSS Syntax (Toggle Plain Text)
  1. <%@ LANGUAGE="JAVASCRIPT" %>
  2. <% var style = new String(Request.Cookies('style'));
  3. if(style==null || style==''){
  4.   style = new String(Request.Form('style'));
  5.   if(style==null || style==''){
  6.    style="default";
  7.   }else{
  8.    Response.Cookies('style') = style;
  9.   }
  10. }
  11. %>
  12. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a rel="nofollow" href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" target="_blank">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>">
  13. <html xmlns="<a rel="nofollow" href="http://www.w3.org/1999/xhtml" target="_blank"> http://www.w3.org/1999/xhtml</a> ">
  14. <head> 
  15. <link rel="stylesheet" type="text/css" href="style_<%Response.write(style)%>.css"/>
  16. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  17. <title>Untitled Document</title>
  18. </head>
  19. <body>
  20. <form id="form1" name="form1" method="post" action="">
  21.   <p>
  22.     <select name="style" id="style">
  23.       <option value="1" selected="selected">1</option>
  24.       <option value="2">2</option>
  25.     </select>
  26. </p>
  27.   <p>
  28.     <input type="submit" name="Submit" value="Submit" />
  29. </p>
  30. </form>
  31. <p>&nbsp;</p>
  32. <h1>test heading1 set only in styles.css (origional style) </h1>
  33. </body>
  34. </html>

2 style sheets and page:

page: http://grafax.co.uk/switch/
style1: http://grafax.co.uk/switch/style_1.css
style2: http://grafax.co.uk/switch/style_2.css

somthing is still going wrong but im not sure. i understand a little of the asp code but not much.

Thanks for all your help by the way!
Reputation Points: 32
Solved Threads: 3
Posting Whiz in Training
MaxMumford is offline Offline
228 posts
since Oct 2006

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in HTML and CSS Forum Timeline: Problems with CSS in IE
Next Thread in HTML and CSS Forum Timeline: Html





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC