Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

asp.net button styles

Posted on 2004-03-25
7
Medium Priority
?
1,442 Views
Last Modified: 2010-08-05
I am doing a project in asp.net.  The site has a dozen asp web control buttons on it.  The client wants a certain style applied to all buttons.  What do I put in the style sheet?
0
Comment
Question by:dbyrne03
  • 4
  • 3
7 Comments
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 10676923
the style sheet.

.buttclss {color:blue; other properties etc}

The in you code where you generate the buttons add a class attribute:

class="buttclss"

Cd&
0
 

Author Comment

by:dbyrne03
ID: 10679367
I was hoping to avoid this because although it allows me to centrally manage the behavior and appearance of buttons from one file, the style sheet, I still have to go around to every button in the site and type " class='buttclss'" .  For example, if you want to apply a style to all <td> elements, you don't need to put class='tdclss' in every <td> element in your site, you just put
td { color:blue }
in the style sheet.
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 10682028
Not necessarily.  you could do it dynamically with script:

<script type="text/javascript">
<!--
function setstyle()
{
   for (i=0;i<document.forms.length;i++)
   {
      frm=document.forms[i]
      for (j=0;j<frm.elements.length;j++)
       {
           target=frm.elements[j];
           if (target.type=="BUTTON" || target.type=="SUBMIT" || target.type=="RESET")
target.className="buttclss";
        }
     }
 }
onload.=setstyle;
//-->
</script>

Just put that in a .js file and source it in in the head of the pages.

Cd&
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 

Author Comment

by:dbyrne03
ID: 10682463
couple of quick things.  first, thanks for the script.  there was an error for
onload.=setstyle;
so I changed it to
onload=setstyle;

But it still didn't work.  So I put
alert(target.type);
right before
target.className="buttclss";

the weird thing is, the alert box does not pop up, but the style does take effect.  what is even more weird, the style is applied to textboxes as well.  check out http://137.229.174.53:8080/search.aspx
0
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 400 total points
ID: 10683034
My bad.  I didn't deal with the case.  The if needs to look like this.

if (target.type.toLowerCase()=="button" || target.type.toLowerCase()=="submit" || target.type.toLowerCase()=="reset")
{
target.className="buttclss";
}

What happened when you put the alert in is it change the scope of the if.  An if without {} has a scope of just the next command.  So setting the class became unconditional.

Cd&
0
 

Author Comment

by:dbyrne03
ID: 10683503
that was it.  thanks buddy.
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 10695029
Glad I could help.  Thanks for the A/ :^)

Cd&
0

Featured Post

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.

Question has a verified solution.

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

When applying CSS to your HTML, there are many different ways to select which element(s) the CSS applies to.  Some of these selectors are more commonly known and used than others - Here are the more common ones: #X - Matches an ID of X .X - Matche…
Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer…
In this Micro Tutorial users will learn how to embed custom fonts into websites using @font-face in CSS Select a font: Ensure the EULA allows you to use @font-face: Download the font: Get the browser-compatible files you need: Edit your CSS       - Name …
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…
Suggested Courses

886 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