/    Sign up×
Community /Pin to ProfileBookmark

Hi im a beginner to java script and was just wondering if someone could have a look to see where im going wrong.

Basically what i am trying to do is make it so a image changes when i select a different radio button, for example when i click green the shirt will go from the default color and change to green.

Here is my script
——————-

<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>Untitled Document</title>
<link href=”../Documents/College/Web Design Assignment/MovieProps/images/styles.css” rel=”stylesheet” type=”text/css” />
</head>

<body>
<script type = text “text/javascript”>

function displayClothesPics(box){

var ClothesPics = new Array(3)
ClothesPics[1]=”../Documents/College/Web Design Assignment/MovieProps/images/cat1prod1thumb.jpg”
ClothesPics[2]=”../Documents/College/Web Design Assignment/MovieProps/images/editedredcat1prod1thumb.jpg”;
ClothesPics[3]=”../Documents/College/Web Design Assignment/MovieProps/images/editedbrowncat1prod1thumb.jpg”;
document.getElementById(‘MainImage’).src = ClothesPics[parseInt(box.value)];
}

</script>

<table>

<tr>
<td>

<form name=”ColourSelections”>

<h2>Colour Selection</h2>
<input type=”radio” name=”Colour” value=”1″ onclick=”UpdateImage(this.form);”>Blue

<input type=”radio” name=”Colour” value=”2″ onclick=”UpdateImage(this.form);”>Red

<input type=”radio” name=”Colour” value=”3″ onclick=”UpdateImage(this.form);”>Brown

</form>

</tr>
<td>
<img src=”../Documents/College/Web Design Assignment/MovieProps/images/editedpurplecat1prod1thumb.jpg” name=”MainImage” id=”MainImage” />

</td>
</tr></table>

</body>
</html>

Help would be appreciated
thank you

to post a comment
JavaScript

3 Comments(s)

Copy linkTweet thisAlerts:
@nap0leonMay 02.2012 — 1: this

<script type = text "text/javascript">

should be

<script type = "text/javascript">

2: your radio buttons call "UpdateImage" but your function is named "displayClothesPics"

3: you are passing the form into the function, but then asking for the value of the form... forms don't have values, elements *inside of* forms have values. Change to just passing "this"

4: your HTML is malformed (though not critical to your question) - your opening and closing of TDs and TRs don't match up.

If this weren't a homework assignment, I'd post code that works... but the above tells you everything that is wrong with the functionality you requested aid with.
Copy linkTweet thisAlerts:
@PadonakMay 02.2012 — lol )) [B]AndrewHardy21[/B], you should hide your images src from [B]nap0leon[/B] to get the working code!
Copy linkTweet thisAlerts:
@TheAliveWinnerMay 02.2012 — lol )) [b]andrewhardy21[/b], you should hide your images src from [b]nap0leon[/b] to get the working code![/quote]

? ? ?
×

Success!

Help @AndrewHardy21 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.17,
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,
)...