Solved

apply css style to details view on edit

Posted on 2014-01-27
5
631 Views
Last Modified: 2014-01-27
Hello I have a question, would someone be able to explain to me how to apply alternate row colors to a details view when in edit mode?

I am not finding information about this, maybe because using wrong keywords for search.

Any help would be nice, if examples provided even better!

Thank you much!
0
Comment
Question by:metropia
[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
  • 3
  • 2
5 Comments
 
LVL 53

Expert Comment

by:Scott Fell, EE MVE
ID: 39812439
You would use nth child https://developer.mozilla.org/en-US/docs/Web/CSS/:nth-child#Example_selectors and you can simply use nth-child(odd)

table#MyTable{
  tr:nth-child(odd)
}

Open in new window

0
 

Author Comment

by:metropia
ID: 39812483
is this to be applied to a detaileview control on a asp.net form?
0
 
LVL 53

Expert Comment

by:Scott Fell, EE MVE
ID: 39812503
That is your external style sheet.   Your rendered code would look like http://jsbin.com/EtIQUWeQ/1/edit

I am not a .net dev but I think your table would be

<asp:Table id="MyTable"  runat="server" />

The external css would create the formatting.
<!DOCTYPE html>
<html>
<head>
 <style>
   table#MyTable
   tr:nth-child(odd){background-color:red;
}
  </style>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <table id="MyTable">
    <tr><td>stuff</td></tr>
    <tr><td>stuff</td></tr>
    <tr><td>stuff</td></tr>
    <tr><td>stuff</td></tr>
    <tr><td>stuff</td></tr>
    <tr><td>stuff</td></tr>
    <tr><td>stuff</td></tr>
    
  </table>
</body>
</html>

Open in new window

0
 

Author Comment

by:metropia
ID: 39812544
i see. it sort of works.

the thing is that i need the style only applied when the details view is on Edit mode.
0
 
LVL 53

Accepted Solution

by:
Scott Fell,  EE MVE earned 500 total points
ID: 39812626
When you go to edit mode, add a class.  http://jsbin.com/EtIQUWeQ/2/edit

Here is the same thing but applying to a class called "edit".  When it the table is not in edit mode:    <table id="MyTable"> and when in edit mode  <table id="MyTable" class="edit">  You may need to do this with js/jquery or if you are doing a page refresh to get to edit mode, then add the class via your serverside code.

<!DOCTYPE html>
<html>
<head>
 <style>
   table#MyTable.edit
   tr:nth-child(odd){background-color:red;
}
  </style>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <table id="MyTable" class="edit">
    <tr><td>stuff</td></tr>
    <tr><td>stuff</td></tr>
    <tr><td>stuff</td></tr>
    <tr><td>stuff</td></tr>
    <tr><td>stuff</td></tr>
    <tr><td>stuff</td></tr>
    <tr><td>stuff</td></tr>
    
  </table>
</body>
</html>

Open in new window

0

Featured Post

Instantly Create Instructional Tutorials

Contextual Guidance at the moment of need helps your employees adopt to new software or processes instantly. Boost knowledge retention and employee engagement step-by-step with one easy solution.

Question has a verified solution.

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

Lots of people ask this question on how to extend the “MembershipProvider” to make use of custom authentication like using existing database or make use of some other way of authentication. Many blogs show you how to extend the membership provider c…
Just a quick little trick I learned recently.  Now that I'm using jQuery with abandon in my asp.net applications, I have grown tired of the following syntax:      (CODE) I suppose it just offends my sense of decency to put inline VBScript on a…
Exchange organizations may use the Journaling Agent of the Transport Service to archive messages going through Exchange. However, if the Transport Service is integrated with some email content management application (such as an antispam), the admini…
Attackers love to prey on accounts that have privileges. Reducing privileged accounts and protecting privileged accounts therefore is paramount. Users, groups, and service accounts need to be protected to help protect the entire Active Directory …

734 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