/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] Javascript error I can’t figure out

Hi,

I hope someone can help.
I’m experiencing an issue with a javascript error that i can’t figure out.

This is the bit of code that is going wrong (in red):
function getReadyToPlay() {
document.getElementById(“scoreboardHeader”).innerHTML = “”+teamA +” v “+teamB;
document.getElementById(“battingA”).innerHTML = “”+teamA;
document.getElementById(“battingB”).innerHTML = “”+teamB;
if (battingTeam === teamA) {
[COLOR=”#FF0000″]var elementA = document.getElementsByClassName(“A”);[/COLOR]
var elementA1 = document.getElementsByClassName(“batsmanName”);
var elementA2 = document.getElementsByClassName(“runsScored”);
var elementA3 = document.getElementsByClassName(“scoreHowOut”);
document.getElementById(“scoreExtras”).innerHTML = “0”;
document.getElementById(“scoreTotal”).innerHTML = “0”;
document.getElementById(“scoreOvers”).innerHTML = “0”;
document.getElementById(“totalA”).innerHTML = teamARuns;
document.getElementById(“wicketsA”).innerHTML = teamAWickets;
document.getElementById(“oversA”).innerHTML = teamAOvers;
document.getElementById(“totalB”).innerHTML = teamBRuns;
document.getElementById(“wicketsB”).innerHTML = teamBWickets;
document.getElementById(“oversB”).innerHTML = teamBOvers;
for (x=0; x<=11; x++){
[COLOR=”#FF0000″]playerName = elementA[x].value;[/COLOR]
elementA1[x].innerHTML = playerName;
elementA2[x].innerHTML = “0”;
elementA3[x].innerHTML = “NOT OUT”;
AteamScores[x] = 0;
document.getElementsByClassName(“runsScored”).innerHTML = “0”;
$(“td.batsmanName”).eq(0).addClass(“manIn”);
$(“td.batsmanName”).eq(1).addClass(“manIn”);
document.getElementById(“batPlayer1”).innerHTML = teamALineup[0];
document.getElementById(“batPlayer2”).innerHTML = teamALineup[1];

Related to this bit of HTML:
<div id=”Section2″>
<span id=”teamA”>
<p> TEAM A: <input id=”teamAName” type=”text” placeholder=”Team A” value=”ENGLAND” size=”12″> </p>
Player 1: <input id=”A1″ type=”text” placeholder=”Player 1″ value=”ROY” class=”A”> <br>
Player 2: <input id=”A2″ type=”text” placeholder=”Player 2″ value=”HALES” class=”A”> <br>
Player 3: <input id=”A3″ type=”text” placeholder=”Player 3″ value=”ROOT” class=”A”> <br>
Player 4: <input id=”A4″ type=”text” placeholder=”Player 4″ value=”MORGAN” class=”A”> <br>
Player 5: <input id=”A5″ type=”text” placeholder=”Player 5″ value=”STOKES” class=”A”> <br>
Player 6: <input id=”A6″ type=”text” placeholder=”Player 6″ value=”BUTLER” class=”A”> <br>
Player 7: <input id=”A7″ type=”text” placeholder=”Player 7″ value=”BILLINGS” class=”A”> <br>
Player 8: <input id=”A8″ type=”text” placeholder=”Player 8″ value=”RASHID” class=”A”> <br>
Player 9: <input id=”A9″ type=”text” placeholder=”Player 9″ value=”JORDAN” class=”A”> <br>
Player 10: <input id=”A10″ type=”text” placeholder=”Player 10″ value=”PLUNKET” class=”A”> <br>
Player 11: <input id=”A11″ type=”text” placeholder=”Player 11″ value=”FINN” class=”A”> <br>
</span>
<span id=”teamB”>

From what i can tell it should work correctly, but it keeps throwing up an error.

to post a comment
JavaScript

4 Comments(s)

Copy linkTweet thisAlerts:
@JMRKERJun 12.2017 — Since you have hard-coded for 11 elements of 'elementA' collection,

you are actually referencing 12 elements in the following:
<i>
</i>for (x=0; x&lt;=11; x++){
playerName = elementA[x].value;


You might want to check that or use
<i>
</i>for (x=0; x&lt;elementaA.length; x++){
playerName = elementA[x].value;


Check the error console if you need to see the value of elementaA.length.

Also, there may not be a .value associated with the collection.

Perhaps it is .className instead (???)
Copy linkTweet thisAlerts:
@rootJun 13.2017 — Nevermind the coding, the HTML isn't up to much ...

Your using web form inputs without a web form, if you used one, you can make finding the value of them easier.

[code=html]<form name="players" action="javascript:;" >
Player 1: <input name="player" type="text" placeholder="Player 1" value="ROY" class="A"> <br>
Player 2: <input name="player" type="text" placeholder="Player 2" value="HALES" class="A"> <br>
Player 3: <input name="player" type="text" placeholder="Player 3" value="ROOT" class="A"> <br>
Player 4: <input name="player" type="text" placeholder="Player 4" value="MORGAN" class="A"> <br>
Player 5: <input name="player" type="text" placeholder="Player 5" value="STOKES" class="A"> <br>
Player 6: <input name="player" type="text" placeholder="Player 6" value="BUTLER" class="A"> <br>
Player 7: <input name="player" type="text" placeholder="Player 7" value="BILLINGS" class="A"> <br>
Player 8: <input name="player" type="text" placeholder="Player 8" value="RASHID" class="A"> <br>
Player 9: <input name="player" type="text" placeholder="Player 9" value="JORDAN" class="A"> <br>
Player 10: <input name="player" type="text" placeholder="Player 10" value="PLUNKET" class="A"> <br>
Player 11: <input name="player" type="text" placeholder="Player 11" value="FINN" class="A"> <br>
</form>[/code]


function get_player( p ){
return document.forms.players.player[p-1].value;
}
document.getElementById("thetarget").innerHTML = "Player = " + get_player( 7 );

Now, [B]player1 = get_player( 1 );[/B]

as all arrays in javascript start at zero, if you pass 1, it is returning array element 0

You can also update elements of the board
document.forms.players.player[1].value = "WASTE OF SPACE!"; // changes HALES
document.forms.players.player[6].value = "WASTE OF AIR!"; // changes BILLINGS
document.forms.players.player[10].value = "WASTE OF TIME!"; // changes FINN


You can easily do this using a web form and not clutter your code with lots of document.getElementById() calls.
Copy linkTweet thisAlerts:
@rootJun 13.2017 — you can also reduce code document.forms.players.player[1].value = "WASTE OF SPACE!"; // changes HALES
document.forms.players.player[6].value = "WASTE OF AIR!"; // changes BILLINGS
document.forms.players.player[10].value = "WASTE OF TIME!"; // changes FINN
to dfp = document.forms.players;
dfp.player[1].value = "WASTE OF SPACE!"; // changes HALES
dfp.player[6].value = "WASTE OF AIR!"; // changes BILLINGS
dfp.player[10].value = "WASTE OF TIME!"; // changes FINN

What is this anyway? Some homework assignment?
Copy linkTweet thisAlerts:
@SamBonifaceauthorJun 13.2017 — Yeah, it's a homework assignment. I was told to use the code i was given for the HTML stuff.

Also i'm new to this, I've only been doing HTML and JavaScript for about 3-4 months.

Been finding the course difficult, i've not thought it was taught particularly well and the examples haven't been top notch.
×

Success!

Help @SamBoniface spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...