473,788 Members | 2,751 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

onClick from Table Cell Help

Hello,
I'm trying to figure out why the following code won't work for me. The
Firefox javascript console tells me that tableItemClicke d is not
defined, but the function is right there in the code. Any help would be
greatly appreciated.

<script type="text/javascript">

function Initialize() //is called upon page load
{
MakeTable();
}//end Initialize

function MakeTable(){
var iNumCells=10;
var text="";
var counter = 1;

document.write( "<table><ta ble border = 1><tr>");// "table width='50%'
name='mytable'" )
for (counter = 1; counter <= iNumCells; counter++){
text = "";
//funcText="Table ItemClicked('" + counter + "');";

//create a new row every 5 items
if(counter % 5 == 0 && counter!=0){
text = text + "<td id=" + counter + " "+ "
onClick=\"table ItemClicked();\ ">" + "Item: " + counter + "</td></tr>";
alert(text);
document.write( text);
}

else if (counter - 1 % 5 == 0){
text = "<tr><td>It em: " + counter + "</td>";
document.write( text);
}

else{
text = "<td>Item: " + counter + "</td>";
document.write( text);
}
}
document.write( "</table>");

document.write( "<p><div id = 'targetDiv'>Ite m number will appear
here</div></p>");
}// end MakeTable

function tableItemClicke d()
{
alert("tableIte mClicked");
//document.getEle mentById('targe tDiv').innerHTM L = "You clicked item
number " + counter;
}//end TableItemClick

</script>
Apr 20 '06 #1
7 2127
news.east.cox.n et wrote:
Hello,
I'm trying to figure out why the following code won't work for me.
The Firefox javascript console tells me that tableItemClicke d is not
defined, but the function is right there in the code. Any help would be
greatly appreciated.

Use DOM methods to build your table, it's much easier to read.

--
Ian Collins.
Apr 20 '06 #2
I will try the DOM method, but I don't know if that will solve my
problem. I think there is something I'm not understanding about calling
a function from another function. I'm pretty sure that my
misunderstandin g would follow me to DOM.

The actual code to create the tag I'm having trouble with is:
text = text + "<td id=" + counter + " "+ "
onClick=\"table ItemClicked();\ ">" + "Item: " + counter + "</td></tr>";

The tag itself reads:
<td id=5 onClick="tableI temClicked();"> Item 5</td>

JavaScript Console in Firefox reports that:
tableItemClicke d is not defined

Ian Collins wrote:
news.east.cox.n et wrote:
Hello,
I'm trying to figure out why the following code won't work for me.
The Firefox javascript console tells me that tableItemClicke d is not
defined, but the function is right there in the code. Any help would be
greatly appreciated.

Use DOM methods to build your table, it's much easier to read.

Apr 21 '06 #3

news.east.cox.n et wrote:

function Initialize() //is called upon page load
{
MakeTable();
}//end Initialize


If that comment is accurate, it means that you're writing to a closed
document, which will have rather shaky results. How exactly are you
calling Initialize()?

I notice that your code appears to open two tables but closes only one.

The '/' character in closing tags ideally should be escaped: <\/td>
--
S.C.

Apr 21 '06 #4
Stephen Chalmers said on 21/04/2006 11:15 AM AEST:
news.east.cox.n et wrote:

function Initialize() //is called upon page load
{
MakeTable();
}//end Initialize

If that comment is accurate, it means that you're writing to a closed
document, which will have rather shaky results.


Not really shaky, a call to document.write( ) after the document has
loaded will call document.open() , which will remove the entire content
of the page.

The OP's code results in the following HTML:

<TABLE>
<TBODY></TBODY>
</TABLE>
<TABLE border=1>
<TBODY>
<TR>
<TR>
<TD>Item: 1</TD>
<TD>Item: 2</TD>
<TD>Item: 3</TD>
<TD>Item: 4</TD>
<TD id=5 onclick=tableIt emClicked();>It em: 5</TD>
</TR>
<TR>
<TD>Item: 6</TD>
<TD>Item: 7</TD>
<TD>Item: 8</TD>
<TD>Item: 9</TD>
<TD id="10" onclick="tableI temClicked();"> Item: 10</TD>
</TR>
</TBODY>
</TABLE>
<P>
<DIV id="targetDiv"> Item number will appear here</DIV>
<P></P>
The reason calling 'tableItemClick ed()' returns undefined is because the
function is not defined anywhere - it was deleted by document.open()
when document.write( ) was called.

If the Initialize() function is called during page load, the onclick
'works'.

[...]
--
Rob
Group FAQ: <URL:http://www.jibbering.c om/FAQ>
Apr 21 '06 #5
Stephen Chalmers wrote:
news.east.cox.n et wrote:

function Initialize() //is called upon page load
{
MakeTable();
}//end Initialize

If that comment is accurate, it means that you're writing to a closed
document, which will have rather shaky results. How exactly are you
calling Initialize()?

I notice that your code appears to open two tables but closes only one.

Another good reason to use DOM!

--
Ian Collins.
Apr 21 '06 #6
This is how I am calling Initialize()

<body onload="Initial ize()" >
</body>

So, I am calling it during page load

RobG wrote:
Stephen Chalmers said on 21/04/2006 11:15 AM AEST:
news.east.cox.n et wrote:

function Initialize() //is called upon page load
{
MakeTable();
}//end Initialize

If that comment is accurate, it means that you're writing to a closed
document, which will have rather shaky results.


Not really shaky, a call to document.write( ) after the document has
loaded will call document.open() , which will remove the entire content
of the page.

The OP's code results in the following HTML:

<TABLE>
<TBODY></TBODY>
</TABLE>
<TABLE border=1>
<TBODY>
<TR>
<TR>
<TD>Item: 1</TD>
<TD>Item: 2</TD>
<TD>Item: 3</TD>
<TD>Item: 4</TD>
<TD id=5 onclick=tableIt emClicked();>It em: 5</TD>
</TR>
<TR>
<TD>Item: 6</TD>
<TD>Item: 7</TD>
<TD>Item: 8</TD>
<TD>Item: 9</TD>
<TD id="10" onclick="tableI temClicked();"> Item: 10</TD>
</TR>
</TBODY>
</TABLE>
<P>
<DIV id="targetDiv"> Item number will appear here</DIV>
<P></P>
The reason calling 'tableItemClick ed()' returns undefined is because the
function is not defined anywhere - it was deleted by document.open()
when document.write( ) was called.

If the Initialize() function is called during page load, the onclick
'works'.

[...]


Apr 21 '06 #7
Ian Collins wrote:
Stephen Chalmers wrote:
news.east.cox.n et wrote:

function Initialize() //is called upon page load
{
MakeTable();
}//end Initialize


If that comment is accurate, it means that you're writing to a closed
document, which will have rather shaky results. How exactly are you
calling Initialize()?

I notice that your code appears to open two tables but closes only one.

Another good reason to use DOM!


DOM solved the problem. I'm still not sure what I did wrong in the
first instance, but using DOM solved it. Thanks for the help.
Apr 22 '06 #8

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

Similar topics

2
11277
by: Barton | last post by:
Hello, I've got a table row with an onClick event that loads page1. Now I do not want to apply this event to one cell of that row because that cell contains already a link to another page. How do I disable the onClick event on that one cell? Code: <table> <tr onClick="window.location=page1.html'> <td></td>
2
7032
by: Andreas Knollmann | last post by:
Hi, I create an object like this: var cell = document.createElement("td"). It doesn't have to be cell. I want this cell to use the onclick event. What doesn't work in the IE as well as with Mozilla is: cell.onclick = "whatever()";
1
3776
by: Michael | last post by:
How can I use onclick to change a table cell background color. I know I can use this.className=? to change the classname. But then I would have to put the code into every single table cell. I read once about using a collection method. Lets say a table has 100 TD Cells with a white background. I want to click on just 1 and then have it change to a Yellow background. Then when I click on a different Cell have the old one change back to...
6
9943
by: Cockroach | last post by:
Hello, I have a problem where the onClick of a table row will activates a window.location event, and inside a cell in that row, an image onClick event shows/hides a div. The problem is that when you click on the image, it briefly shows the div, and then reloads the page to the window.location url. Is there a way of preventing the onClick of the row (<tr>) from doing
0
3180
by: Diane Yocom | last post by:
I'm very new to ASP.Net and probably jumped in a little over my head, but... I'm trying to create a user control that will control navigation through my site. It's sortof like Amazon.com, where there are tabs at the top with "submenu" buttons showing below the selected tab. The data that defines the tabs and submenus is stored in an XML file and I'm using nested repeaters to build them dynamically. I've got it working pretty well, except...
2
8058
by: Peter | last post by:
Hi, this is the code, and new row and new cell generated ok, but why the onclick and onmouseover doen't work? Thank you in advance! <html> <head> <script language="javascript"> function inserttable() {
4
17145
by: jj6849 | last post by:
I have been using the dom to add a row to my form for awhile now, but now I need to do some validation to make sure certain check boxes aren't checked with other check boxes. Now of course it works with the first row, but after I add a row, the Function does not work (no runtime error or anything). So first is my Function do the validation, second is my code for adding new row (this is where I'm having trouble, maybe with the setAttribute??),...
18
3942
by: joaotsetsemoita | last post by:
Hello everyone, I'm having troubles assigning an onclick event to a cell. Im trying something like cursorPoint.cells.style.cursor = "hand"; cursorPoint.cells.width = "20"; cursorPoint.cells.onclick = "alert('this is a test');" cursorPoint.cells.alt = "Select the columns"; cursorPoint.cells.innerHTML = "&nbsp;"
4
20116
by: prosad | last post by:
hello, Just solved a problem using Javascript onclick, can click on any cell in a dynamic table and it will pass the innerText object value to my form text field. parts of code given below: <script type="text/javascript"> function select_cell(obj) { document.getElementById('complaint').value = obj.innerText; document.getElementById('selected_form'); }
7
13122
by: KDawg44 | last post by:
Hi, I have a series of notes in the cells of a table, when they click the note, it calls a function that creates a text area for the user to edit the note in. What I would like to do is have it so when they click outside the text area, it calls another function that changes it back to a cell displaying the data with the changes. Is there anyway to do this? Something like:
0
9656
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, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
9498
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
10366
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, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
9967
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 protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
1
7517
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
6750
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
5536
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
4070
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
3
2894
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

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.