Allocating colors dynamically for table cells in javascript

Author

Message

fathima_sony

Post subject: Allocating colors dynamically for table cells in javascript

Posted: Thu Jun 30, 2011 9:41 am

Joined: Wed Jun 29, 2011 11:44 am
Posts: 23

Hi Friends
This will help you to allocate colors for table cells dynamically, when you click on a particular cell it asks for you to enter the color which you want to fill the cell with ,if the given color exists the cell color will be changed to the particular color.
<html>
<head>
<script type="text/javascript">
function fill_color(tval)
{ var col=prompt("please enter the color");
var colors=["pink","blue","red","black","grey","yellow","brown","orange"];
if(col=="")
{
alert("please enter the color");
}

for(var i=0;i<colors.length;i++)
{
for(var j=1;j<=12;j++){
if(document.getElementById("td"+j).style.backgroundColor==col)
{
alert("color already exists");return false;
}
else{
if(col==colors[i]){
document.getElementById(tval).style.backgroundColor=col;
var sta=prompt("please enter the status");
document.getElementById(tval).innerHTML=sta;
return false;}
}
}

}
if(col!=colors[i]){ alert("color does not exists"); return false;}

}
</script>
</head>
<body><center>
<table border=1 width=600 height=800 ><form name="myform" method="post">
<tr width=600 height=200>
<td height=200 width=200 id="td1" onclick="fill_color(this.id)">1</td>
<td height=200 width=200 id="td2" onClick="fill_color(this.id)">2</td>
<td height=200 width=200 id="td3" onClick="fill_color(this.id)">3</td>
</tr>
<tr width=600 height=200>
<td height=200 width=200 id="td4" onClick="fill_color(this.id)">4</td>
<td height=200 width=200 id="td5" onClick="fill_color(this.id)">5</td>
<td height=200 width=200 id="td6" onClick="fill_color(this.id)">6</td>
</tr>
<tr width=600 height=200>
<td height=200 width=200 id="td7" onClick="fill_color(this.id)">7</td>
<td height=200 width=200 id="td8" onClick="fill_color(this.id)">8</td>
<td height=200 width=200 id="td9" onClick="fill_color(this.id)">9</td>
</tr>
<tr width=600 height=200>
<td height=200 width=200 id="td10" onClick="fill_color(this.id)">10</td>
<td height=200 width=200 id="td11" onClick="fill_color(this.id)">11</td>
<td height=200 width=200 id="td12" onClick="fill_color(this.id)">12</td>
</tr>
Thanks

Top

Page 1 of 1

[ 1 post ]

Page 1 of 413

1, 2, 3, 4, 5 ... 413

	Replies	Views	Last post
Ecommerce website development and website Design by iweballey » Fri May 17, 2013 7:15 am in PHP-Code Help	0	146	Fri May 17, 2013 7:15 am iweballey
How to upgrade and migrate Joomal site by mallikharjuna rao » Mon Jan 21, 2013 1:40 pm in Joomla	1	344	Thu May 16, 2013 9:53 am sunitha12
Benefits of PHP by hirephpexpert » Fri Sep 07, 2012 4:41 am in CakePHP	6	1573	Wed May 15, 2013 6:25 am PrettyPrincesG
How to stop user from getting registered in Joomla by mallikharjuna rao » Tue Jan 22, 2013 5:16 am in Joomla	3	1482	Wed May 15, 2013 6:17 am PrettyPrincesG
How to write a query in social engine by fathima_sony » Tue Sep 06, 2011 12:34 pm in Others	2	1756	Tue May 14, 2013 12:09 pm sanath123

Other Forums

Other Services

Search