Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 495
  • Last Modified:

CSS

Hey...I am developing a web application in VB.net...I have multiple style sheeets which I want to use in a webpage MyPage.aspx depending on the radio button selected. I mean to say if i selected radio button 1 then one.CSS must be applied to MyPage.aspx. Similarly for the other two radio buttons. I am using this for linking to the CSS files.
<link rel"stylesheet" href="one.CSS" type="text/css">. I think instead of using one.CSS here I need to pass in the parameter dynamically.
Can anyone help me out how to dynamically change the CSS in vb.net? Thank you.
0
niki_kiran
Asked:
niki_kiran
  • 8
  • 4
  • 3
  • +1
1 Solution
 
mrichmonCommented:
You may want to look here:

http://www.csszengarden.com/

Notice how every page is the same content, but the link you click determines which stylesheet is loaded
0
 
mrichmonCommented:
These may help too:

Replacing Style Sheets
http://msdn.microsoft.com/workshop/author/dynstyle/style_sheets.asp

Changing Styles
http://4umi.com/web/css/changesheet.htm
"The look of this page will change dynamically, without reloading, when the stylesheet is changed..."

and it is done via  select box which will be close to the logic you want with a radio button - just change to access radio instead of select
0
 
GrandSchtroumpfCommented:
Alternate stylesheets are part of the html specification.
The stylesheet selection is not implemented in IE, but you can make it work using javascript and a cookie.
Full details in this article:  http://www.alistapart.com/articles/alternate/
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
JohnModigCommented:
Hi there.
Here's some code (not just links ^^ ) to provide with what you need.
You see, just to be able to change stylesheet once is not enough. You also need to pass that variable to other pages, so they get the same style as what you choosed last time, otherwise you have too choose over and over, which is obviously not something we want, right?
Many would choose to do this using session, but I prefer to do it with querystring. Much safer imho, since many users nowadays do not accept session cookies for security reasons. Hence the need of #4.

------------------------------------------
1. Create 4 different style sheets.
------------------------------------------
Name these "style1.css", "style2.css", "style3.css", "style4.css".
Save them in the same folder of your website.

------------------------------------------
2. Put this code between the <head> tags of your webpage:
------------------------------------------
<% Dim cssNum
if request.form("css") <> "" then
cssNum = request.form("css")
elseif request.querystring("css") <> "" then
cssNum = request.querystring("css")
else
cssNum = "1"
end if %>
<link rel="stylesheet" href="style<%=cssNum%>.css" type="text/css">


------------------------------------------
3. In the body of your webpage, put this:
------------------------------------------
<form name="cssform" method="post" action="">
<input name="css" type="radio" value="1" onClick="this.form.submit();"> style 1<br>
<input name="css" type="radio" value="2" onClick="this.form.submit();"> style 2<br>
<input name="css" type="radio" value="3" onClick="this.form.submit();"> style 3<br>
<input name="css" type="radio" value="4" onClick="this.form.submit();"> style 4<br>
</form>

------------------------------------------
4. To maintain the style, add this to all internal links in your webpage:
------------------------------------------
?css=<%=cssNum%>

Example:

<a href="mypage.aspx?css=<%=cssNum%>">My page</a>

------------------------------------------
Also, make sure you have removed your old stylesheet link (<link rel="stylesheet" href="one.CSS" type="text/css">).
Let me know how it turns out.

Regards,
John
0
 
GrandSchtroumpfCommented:
> Here's some code (not just links ^^ ) to provide with what you need.
A link is sometimes enough when it points to the right place.

The article includes a script that writes/loads the selected style to/from a cookie.
It works great, it's completely transparent and it respects the standards.  It allows you to modify the style using either the browser's built-in selector or using some javascript method that you can place anywhere.  Also, it allows you to switch stylesheet without having to reload the page.

It's a great article that all web designers should read.
0
 
JohnModigCommented:
GrandSchtroumpf,
I do agree that the article you linked to is great and it does what the questioner asks for. I was refering to the other posts (like the first one - great site, but it does not say anything about how to change styles using radio buttons in vb.net, wich was the question) and also to the fact that sometimes people just googles the question and throws in a link in hope of gaining a few points. This is sadly something I see more and more of. EE is not a link collection, but needs quality answers imho. Links can die easily, websites can change addresses or simply be deleted. So, if most answers consists of links, then EE will become a huge collection of dead links or, as an alternative, needs to come up with some kind of script to check for dead links, which will be a hustle.
However, I do agree that sometimes a link is enough, as long as it really does what the questioner asks for, and so it is in your case.
I had no intention to offend you and I am sorry if I did.

Regards,

John
0
 
JohnModigCommented:
niki_kiran,
if using my suggestion you also might wanna throw in a submit button on the form.
That will provide you with a complete server side solution that does not rely on javascript or cookies. Bear in mind that many user have these disabled for security reasons. ;)
0
 
GrandSchtroumpfCommented:
> I had no intention to offend you and I am sorry if I did.
No offence at all.
Sometimes people are not aware of the alternate solutions they have. In this case changing the style in vb.net should work fine, but it's not the best solution IMHO.
Most of the time i prefer server-side solutions over javascript/cookies, but changing the stylesheet is just an enhancement.  So if the user has disabled javascript or cookies, the site will still work perfectly fine (most users have javascript and cookies enabled though).
The nice thing about the code provided in the article is that it's transparent and non-obtrusive, so it's much easier to maintain.  It just requires an include the links for the styles and the javascript... and it does not change the urls (that's nice for the log analysers).
0
 
niki_kiranAuthor Commented:
Hi...thank you for all the comments....but what i am doing here is getting the style sheet file name from database and trying to assign it to the page when it loads...in short when the page loads i am getting the CSS file name from the database and i want to use that in the
<link rel"stylesheet" href="one.CSS" type="text/css">
line....can i use a varialbe in the place of "one.CSS"???
0
 
JohnModigCommented:
Eeh.. you have the filenames in a database? Why didn't you said so?
Of course you can substitute "one.CSS" with your variable or recordset field.
Something like:
-------------------
<link rel"stylesheet" href="<%=(MyRecordset.Fields.Item("MyField").Value)%>" type="text/css">
0
 
JohnModigCommented:
ups - a typo :/
It should be:
<link rel="stylesheet" href="<%=(MyRecordset.Fields.Item("MyField").Value)%>" type="text/css">
            ^
0
 
niki_kiranAuthor Commented:
Hey thank you for this. But i got a question though....i am getting the file name in the page load event of MyPage.aspx. so can i use the same variable value in the MyPage.aspx.vb (that is the HTML part of the page)????  
0
 
mrichmonCommented:
>> GrandSchtroumpf  I had no intention to offend you
So you were trying to offend me then?  Since you specifically point out my post?

It isn't "just a Google search to get points" as you suggest.

It was supposed to be one post, but I hit enter which submitted so it became two.  The zengarden link is not exactly what was asked, but I have found that most people who ask this type of question find the zengarden link very useful.

Additionally the second two links show a working example of how to dynamically change the stylesheet - including the code in the page, how to name the styles, etc.  I even mentioned that a slight change would be needed to connect the logic to a radio instead of a select, but that is trivial.  And if the user had come back asking for that code I would have coded it for them.

There is no reason not to post a link when it contains the information being looked for.  In fact that is better than copying the content from those pages - which is copyright violation.

We are all supposed to be working together here - not bashing an answer or accusing someone of trying to quickly grab points just because you think your code is better than providing a link.
0
 
JohnModigCommented:
Yes, you should be able to use variables in there as well. Though it's kinda hard to me since I don't have your code. Try it out, tell me the result and I'll talk you thru it.
0
 
niki_kiranAuthor Commented:
Hey John I am trying this code...instead of using css file from the database i am just stroring it in a string and passing it to the MyPage.aspx.vb....its giving me compilation error..here is the code...

MyPage.aspx:
           If Not Page.IsPostBack Then
                Dim strCSS As String
                strCSS = "/_styles/StyleSheet1.css"
            End If

MyPage.aspx.vb:
           <link rel="stylesheet" href="<%= strCSS %>" type="text/css">

StyleSheet1.css:
           H1
{
      COLOR: red
}

I thought of using this first and see whether passing the css file name to MyPage.aspx.vb works or not. Can you help me out??
0
 
JohnModigCommented:
mrichmon,
I am sorry mate, but I think you are blowing this one way out of proportion. How can you possibly think that I was intentionally trying to offend you just because I wrote (not just links ^^ )? Well, I was not, and since you obviously seems to believe the contrary, I ask you to accept my apologies. I am not accusing you of anything.

To write the ^^-sign is not the same thing as giving someone the finger.
All I did was to point out that I was providing code instead of a link - not saying that my suggestion was a better appempt. I refer to my former post to GrandSchtroumpf about my point of view on the link issue. Of course I think of EE as a friendly community full of people helping each other out, and I will strive to keep this vision alive.
0
 
niki_kiranAuthor Commented:
Hey Guys i think I got what I am looking for. I used Literal control in my head tag of the HTML code and i changed the text of that literal in the code behind and it worked. Thank You.
0
 
JohnModigCommented:
Good thinking there mate. The Literal control should easily replace my old school asp tags, as I did not know you were using a code-behind aspx.vb page. You got ahead of me there, I'm afraid I was so much into explaining myself in the sidetrack discussion that I almost forgot to aswer your question for a while :)
Anyway, glad that you got it sorted.

John
0

Featured Post

Hire Technology Freelancers with Gigs

Work with freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely, and get projects done right.

  • 8
  • 4
  • 3
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now