473,406 Members | 2,220 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,406 software developers and data experts.

datalist background image for each cell

Hi,
Right now I have a datalist, that renders the following html:

<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Monday</div> </td>
</tr>
<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Tuesday</div> </td>
</tr>
<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Wednesday</div> </td>
</tr>

We now need to have each cell use a background image, but they need to
vary, so Monday's background image will not be the same as Tues. The
images sizes will be the same, but the image displayed will vary. Is
there anyway to do this? I can remove the ItemStyle-CssClass="daycss"
property I've set in the datalist, but how do I get it to set a
different image for each cell?

Thanks.

Dec 4 '06 #1
4 6241
Prepare css classes for every image. Handle the datalist's PreRender event.
In the event, loop through the datalist items and set the CssClass property
for every item to the required css class depending on the item's day of
week.

--
Eliyahu Goldin,
Software Developer & Consultant
Microsoft MVP [ASP.NET]
"phil2phil" <ph*********@yahoo.comwrote in message
news:11*********************@j44g2000cwa.googlegro ups.com...
Hi,
Right now I have a datalist, that renders the following html:

<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Monday</div</td>
</tr>
<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Tuesday</div</td>
</tr>
<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Wednesday</div</td>
</tr>

We now need to have each cell use a background image, but they need to
vary, so Monday's background image will not be the same as Tues. The
images sizes will be the same, but the image displayed will vary. Is
there anyway to do this? I can remove the ItemStyle-CssClass="daycss"
property I've set in the datalist, but how do I get it to set a
different image for each cell?

Thanks.

Dec 4 '06 #2
Hi,
Thanks for the response, could you show me how to loop through the
datalist items and set the CssClass, a quick sample?

Thanks again.

Eliyahu Goldin wrote:
Prepare css classes for every image. Handle the datalist's PreRender event.
In the event, loop through the datalist items and set the CssClass property
for every item to the required css class depending on the item's day of
week.

--
Eliyahu Goldin,
Software Developer & Consultant
Microsoft MVP [ASP.NET]
"phil2phil" <ph*********@yahoo.comwrote in message
news:11*********************@j44g2000cwa.googlegro ups.com...
Hi,
Right now I have a datalist, that renders the following html:

<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Monday</div</td>
</tr>
<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Tuesday</div</td>
</tr>
<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Wednesday</div</td>
</tr>

We now need to have each cell use a background image, but they need to
vary, so Monday's background image will not be the same as Tues. The
images sizes will be the same, but the image displayed will vary. Is
there anyway to do this? I can remove the ItemStyle-CssClass="daycss"
property I've set in the datalist, but how do I get it to set a
different image for each cell?

Thanks.
Dec 4 '06 #3
something like

foreach (DataListItem item in myDataList.Items)
{
item.CssClass = getItemClass(item);
}

string getItemClass (DataListItem item)
{
// get the day for the item
...
// get the class for the day
...
}
--
Eliyahu Goldin,
Software Developer & Consultant
Microsoft MVP [ASP.NET]

"phil2phil" <ph*********@yahoo.comwrote in message
news:11**********************@j44g2000cwa.googlegr oups.com...
Hi,
Thanks for the response, could you show me how to loop through the
datalist items and set the CssClass, a quick sample?

Thanks again.

Eliyahu Goldin wrote:
Prepare css classes for every image. Handle the datalist's PreRender
event.
In the event, loop through the datalist items and set the CssClass
property
for every item to the required css class depending on the item's day of
week.

--
Eliyahu Goldin,
Software Developer & Consultant
Microsoft MVP [ASP.NET]
"phil2phil" <ph*********@yahoo.comwrote in message
news:11*********************@j44g2000cwa.googlegro ups.com...
Hi,
Right now I have a datalist, that renders the following html:
>
<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Monday</div</td>
</tr>
<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Tuesday</div</td>
</tr>
<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Wednesday</div</td>
</tr>
>
We now need to have each cell use a background image, but they need to
vary, so Monday's background image will not be the same as Tues. The
images sizes will be the same, but the image displayed will vary. Is
there anyway to do this? I can remove the ItemStyle-CssClass="daycss"
property I've set in the datalist, but how do I get it to set a
different image for each cell?
>
Thanks.
>

Dec 4 '06 #4
Thanks again!

Eliyahu Goldin wrote:
something like

foreach (DataListItem item in myDataList.Items)
{
item.CssClass = getItemClass(item);
}

string getItemClass (DataListItem item)
{
// get the day for the item
...
// get the class for the day
...
}
--
Eliyahu Goldin,
Software Developer & Consultant
Microsoft MVP [ASP.NET]

"phil2phil" <ph*********@yahoo.comwrote in message
news:11**********************@j44g2000cwa.googlegr oups.com...
Hi,
Thanks for the response, could you show me how to loop through the
datalist items and set the CssClass, a quick sample?

Thanks again.

Eliyahu Goldin wrote:
Prepare css classes for every image. Handle the datalist's PreRender
event.
In the event, loop through the datalist items and set the CssClass
property
for every item to the required css class depending on the item's day of
week.
>
--
Eliyahu Goldin,
Software Developer & Consultant
Microsoft MVP [ASP.NET]
>
>
"phil2phil" <ph*********@yahoo.comwrote in message
news:11*********************@j44g2000cwa.googlegro ups.com...
Hi,
Right now I have a datalist, that renders the following html:

<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Monday</div</td>
</tr>
<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Tuesday</div</td>
</tr>
<tr>
<td class="daycss" align="Left" valign="Top"
style="background-color:#EEEEEE;height:20px;">
<div style="PADDING-LEFT:26px;
PADDING-TOP:1px">Wednesday</div</td>
</tr>

We now need to have each cell use a background image, but they need to
vary, so Monday's background image will not be the same as Tues. The
images sizes will be the same, but the image displayed will vary. Is
there anyway to do this? I can remove the ItemStyle-CssClass="daycss"
property I've set in the datalist, but how do I get it to set a
different image for each cell?

Thanks.
Dec 4 '06 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

5
by: Thierry Schembri | last post by:
Hi ! I'm facing problems with a background image in a table (with IE & Opera), it works with FF : the <tr> has a background image, but the background repeats in each <td> ex : tr...
5
by: proximus | last post by:
Hi, I am trying to change the background of table TD's. The problem is that I have no access to the HTML code. SO I am trying to alter this using Javascript/DOM in an external .js file. I...
5
by: Doug Laidlaw | last post by:
HTML validators say that "background" is not a valid attribute for a <td> tag I want to set an image as the background for one cell only, and to have the cell content on top of it. If I can't...
13
by: Giggle Girl | last post by:
Hi there, I need to use a background image in a TR that does NOT restart everytime it hits a TD. Can it be done? Specifically, if you set a background image for an entier table, now mater how...
0
by: sklett | last post by:
I had this working at some point... then something happened. I have a DataList that is set to repeat vertically, I have an asp:image in each ItemTemplate and the whole thing comes together to work...
0
by: massimop | last post by:
Hi to all, I use a datalist, that should return a table with 3 columns. The cell of the first column is used to show an image . The cell of the second colun is used to show a * (separator) ....
2
by: Mark | last post by:
IE creates an object of every ID'd HTML tag (so it appears), and each object sets a property for any parameter I set in the tag. For example, my HTML might be: <td id='cell1'...
2
by: BengtPelle | last post by:
I have a page with two Datalists containing X number of ImageButtons. When the user clicks on an image in Datalist1 I need to copy the image to "Obverseimg" when the user clicks an image in...
0
by: RCon | last post by:
I'm unsure if a datalist with in a datalist is the best option for what i'm doing, which is I have a 3 tables, table1, table2 and table3. Each item in table1 will have multiple items from table2...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.