Databases
StackOverflow2013
Postsdbo
POChanging the Text of a Button in a Table
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POChanging the Text of a Button in a Table
    text
    copied!<p>I haven't been programming in javascript that long and come from a Java background. I am trying to use event handlers in my code and I am running into problems. I have a 3x3 table since I am making a tic tac toe game and when the user clicks on one of the boxes I want to change the button text to an X. So I have the html for my table and buttons are the table data and I have assigned all buttons when clicked to the same function. When a button is clicked I sent its ID to my function and from there I try to use this ID param to set the text but it's just not happening at this point and I'm sort of confused why not. I also did a prompt(paramID) and paramID is correct so I don't understand what's going on. Any help would be greatly appreciated! It's probably something stupid I did on my part. I've tried firefox and chrome...</p> <p>Here is my code:</p> <pre><code>&lt;table id="tictable" border="1" &lt;tr id="row1"&gt; &lt;td&gt;&lt;button id="button1" type="button" onclick="actionPerformed(this.id)"&lt;/button&gt;&lt;/td&gt; &lt;td&gt;&lt;button id="button2" type="button" onclick="actionPerformed(this.id)"&lt;/button&gt;&lt;/td&gt; &lt;td&gt;&lt;button id="button3" type="button" onclick="actionPerformed(this.id)"&lt;/button&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr &gt; &lt;td&gt;&lt;button id="button4" type="button" onclick="actionPerformed(this.id)"&lt;/button&gt;&lt;/td&gt; &lt;td&gt;&lt;button id="button5" type="button" onclick="actionPerformed(this.id)"&lt;/button&gt;&lt;/td&gt; &lt;td&gt;&lt;button id="button6" type="button" onclick="actionPerformed(this.id)"&lt;/button&gt;&lt;/td&gt; &lt;/tr&gt; &lt;tr id="row3"&gt; &lt;td&gt;&lt;button id="button7" type="button" onclick="actionPerformed(this.id)"&lt;/button&gt;&lt;/td&gt; &lt;td&gt;&lt;button id="button8" type="button" onclick="actionPerformed(this.id)"&lt;/button&gt;&lt;/td&gt; &lt;td&gt;&lt;button id="button9" type="button" onclick="actionPerformed(this.id)"&lt;/button&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;script type="text/javascript"&gt; function actionPerformed(paramID) { document.getElementById(paramID).value = "X"; } &lt;/script&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload