Solved

css file using passed variables from asp page to control background, text, tables, etc.

Posted on 2006-11-19
4
248 Views
Last Modified: 2008-02-01
Here is my problem.  I have a asp page (1st Page) that passes values to another page (2nd page).  Some of these values passed need to control the css like background color, table border color, text color, etc.  The user is entering the color number minus the pound sign for each field passed.  I know these pass to the 2nd page correct becuase I can display them on the page using <%= Request.QueryString("myfieldname") %>.

My problem is programmatically control the css.  It appears I cannot use variables in a css file which is what I was trying to accomplish below?  

I have found a few examples of making the css file an asp page but I don't know how to write asp style sheets for the thinks i need to control.  If I have to use an asp style sheet I need examples or web sites to learn how to do css for text, tables, table borders, etc in asp.


1st Page: users enters some fields, clicks on a preview button, which takes then to page 2 and passed variables.


2nd Page: shows passed fields on page, but some passed fields need to control the css.

<link href="../CSS_Files/ERL_CSS_Templates.css?css_clrbackground=<%= Request.QueryString("myvarpassedfrom1stpage") %>" rel="stylesheet" type="text/css" />


CSS FILE: called from 2nd Page.

var m_pound = "#" ;
var m_color = new String("<%= Request.QueryString("css_clrbackground") %>") ;
var m_use = m_pound + m_color ;

BODY{
      background-color: {somehow use my the variable m_use here};
}

0
Comment
Question by:elitesys
  • 2
4 Comments
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 125 total points
ID: 17977522
1. create the css with asp:
<link href="../asp/ERL_CSS_Templates.asp?css_clrbackground=<%= Request.QueryString("myvarpassedfrom1stpage") %>" rel="stylesheet" type="text/css" />

just have the asp set the content-type to text/css

OR

2. add the changes to the asp:

<link href="../CSS/ERL_CSS_Templates.css" rel="stylesheet" type="text/css" />
<style>
.css_clrbackground { <%= Request.QueryString("myvarpassedfrom1stpage") %> }
</style>


Michel
PS: http://www.w3schools.com/css/default.asp
0
 
LVL 6

Assisted Solution

by:aescnt
aescnt earned 125 total points
ID: 17977787
<link href="../CSS_Files/ERL_CSS_Templates.css?css_clrbackground=<%= Request.QueryString("myvarpassedfrom1stpage") %>" rel="stylesheet" type="text/css" />

You can't really do this -- unless your css file is renamed to an asp page, i.e., ERL_CSS_Templates.asp. If you're going this route, you will need in the beginning
   <% Response.ContentType = "text/css" %>
...and somehow bypass cache'ing issues (since you'll need to get the CSS file every time, instead of keep a copy in the cache), which I think you're better off not doing (you can't really guarantee that the browser will or will not refresh the CSS file).

Your best bet, IMHO, is to put inline styles, as mplungjan has answered. Just to clarify his code:

   <link href="../CSS/ERL_CSS_Templates.css" rel="stylesheet" type="text/css" />
   <style type="text/css">
    body { background-color: <%= Request.QueryString("css_clrbackground") %>; }
   </style>

(Btw, the code above has an XSS vulnerability. Try to spot it [and fix it].)
What this does is put inline styles in the HTML page, which will override anything on the linked stylesheets. For instance, ERL_CSS_Templates.css defines body background color as "#333333", but if the inline style defines it as "#aa8833", it will override the previous value.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 17978574
yeah, sorry I somehow missed the last part where the css was shown...
0
 
LVL 2

Author Comment

by:elitesys
ID: 17985459
I split the points because Michel got me started and aescnt explanation sealed the deal.

Thanks for the fast responses, big help.

Regards,
Torrey
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

In this article, we'll look how to sort an Array in JavaScript, including the more advanced techniques of sorting a collection of records either ascending or descending on two or more fields. Basic Sorting of Arrays First, let's look at the …
Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

829 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question