Solved

asp.net button styles

Posted on 2004-03-25
7
1,436 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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
[Live Webinar] The Cloud Skills Gap

As Cloud technologies come of age, business leaders grapple with the impact it has on their team's skills and the gap associated with the use of a cloud platform.

Join experts from 451 Research and Concerto Cloud Services on July 27th where we will examine fact and fiction.

 

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 100 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

[Webinar] How Hackers Steal Your Credentials

Do You Know How Hackers Steal Your Credentials? Join us and Skyport Systems to learn how hackers steal your credentials and why Active Directory must be secure to stop them. Thursday, July 13, 2017 10:00 A.M. PDT

Question has a verified solution.

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

This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
In this tutorial viewers will learn how add a full-size background image to a webpage using CSS3. Create a new HTML document with an internal stylesheet.: In CSS, define the html element to have a background image. Use a high resolution image.: In t…
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
Suggested Courses

617 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