Jump to content

Recommended Posts

Hi,

 

I have a script which has the following code:

if(nums <= 10 && (document.getElementById('num' + pickId).style.backgroundColor != 'red') && (document.getElementById('previouslySelected').value == 0)){

			document.getElementById('value' + nums).value=pickId;
			document.getElementById('num' + pickId).style.backgroundColor='red';

			nums++;

		}

 

 

The above script basically changes the background colour of the TD cell to red when clicked.

I wanted to add some code so that if the cell had already been clicked it turned it back to white.

Here is my attempt, however it dosent appear to do anything, can anyone direct me as to where I am going wrong?

 

 

if(document.getElementById('num' + pickId).style.backgroundColor == 'red'){

			document.getElementById('value' + nums).value='';
			document.getElementById('num' + pickId).style.backgroundColor='white';

			nums--;

}

 

Thanks for any help

Link to comment
https://forums.phpfreaks.com/topic/118652-quick-question/
Share on other sites

You could make a global variable to check whether it has been set or not.

<script type="text/JScript">
var toggle = 0;
function change()
{
   document.getElementById('value' + nums).value=pickId;
   if (toggle)
   {
      document.getElementById('value' + nums).style.backgroundColor='white';
      toggle = 0;
   }
   else
   {
      document.getElementById('value' + nums).style.backgroundColor='red';
      toggle = 1;
   }
}
</script>

Link to comment
https://forums.phpfreaks.com/topic/118652-quick-question/#findComment-610864
Share on other sites

Hi,

 

Thanks for the help, I am not really familiar with Javascript and only no very little.

 

I wanted to be able to incorporate it into the current javascript I have, here is the full code:

 

var nums = 1;
var highlightbehavior="TD"

var ns6=document.getElementById&&!document.all
var ie=document.all

function changeto(e,pickId){

	source=ie? event.srcElement : e.target

	if (source.tagName=="TABLE"){

		return;

	}

	while(source.tagName!=highlightbehavior && source.tagName!="HTML"){

		source=ns6? source.parentNode : source.parentElement

	}

	if (source.id!="ignore"){

		if(nums <= 10 && (document.getElementById('num' + pickId).style.backgroundColor != 'red') && (document.getElementById('previouslySelected').value == 0)){

			document.getElementById('value' + nums).value=pickId;
			document.getElementById('num' + pickId).style.backgroundColor='red';

			nums++;

		}
	}

}

Link to comment
https://forums.phpfreaks.com/topic/118652-quick-question/#findComment-610867
Share on other sites

Try this:

var nums = 1;
var highlightbehavior="TD"

var ns6=document.getElementById&&!document.all
var ie=document.all
var toggle = 0;
function changeto(e,pickId){

	source=ie? event.srcElement : e.target

	if (source.tagName=="TABLE"){

		return;

	}

	while(source.tagName!=highlightbehavior && source.tagName!="HTML"){

		source=ns6? source.parentNode : source.parentElement

	}

	if (source.id!="ignore"){

		if(nums <= 10 && (document.getElementById('num' + pickId).style.backgroundColor != 'red') && (document.getElementById('previouslySelected').value == 0)){

			document.getElementById('value' + nums).value=pickId;
			if (toggle)
			{
				document.getElementById('num' + pickId).style.backgroundColor='white';
				toggle = 0;
			}
			else
			{
				document.getElementById('num' + pickId).style.backgroundColor='red';
				toggle = 1;
			}


			nums++;

		}
	}

}

Link to comment
https://forums.phpfreaks.com/topic/118652-quick-question/#findComment-610881
Share on other sites

Hi,

 

Thanks for the code but it dosent appear to do anything when you click on a already selected (red) cell.

 

Edit: Just realised that it seems to be making every other cell white. Its suppose to make them red to start with, if the cell is already red and its clicked on again its suppose to go white.

 

Cheers

Link to comment
https://forums.phpfreaks.com/topic/118652-quick-question/#findComment-610901
Share on other sites

Here's an easy way to do it.  First, give your table an id attribute, then do the following:

<script type="text/javascript">
   window.onload = function()
   {
      var myTable = document.getElementById('tableId'); //get a reference to the table
      var tableCells = myTable.getElementsByTagName('td'); //get all of its cells

      for(var i = 0; i < tableCells.length; i++) //loop through all the cells, adding an onclick style toggle to each one
      {
         tableCells[i].onclick = function()
         {
            if(this.style.backgroundColor == 'white')
            {
               this.style.backgroundColor = 'red';
            }
            else
            {
               this.style.backgroundColor = 'white';
            }
         }
      }
   }
</script>

 

This assumes you're using color names rather than hex values.  You should be able to adapt this idea to your script.

Link to comment
https://forums.phpfreaks.com/topic/118652-quick-question/#findComment-610936
Share on other sites

Try this:

var nums = 1;
var highlightbehavior="TD"

var ns6=document.getElementById&&!document.all
var ie=document.all

function changeto(e,pickId){

	source=ie? event.srcElement : e.target

	if (source.tagName=="TABLE"){

		return;

	}

	while(source.tagName!=highlightbehavior && source.tagName!="HTML"){

		source=ns6? source.parentNode : source.parentElement

	}

	if (source.id!="ignore"){

		if(nums <= 10 && (document.getElementById('num' + pickId).style.backgroundColor != 'red') && (document.getElementById('previouslySelected').value == 0)){

			document.getElementById('value' + nums).value=pickId;

			if (document.getElementById('num' + pickId).style.backgroundColor=='red')
				document.getElementById('num' + pickId).style.backgroundColor='white';
			else
				document.getElementById('num' + pickId).style.backgroundColor='red';

			nums++;

		}
	}


Link to comment
https://forums.phpfreaks.com/topic/118652-quick-question/#findComment-611720
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.