JavaScript Forum

**zarosthegreat** · 07:51 AM

Hi people, I'm new to javascripting and i need some help!!
I'm trying to make a script which uses id's and name's to change values and image src's.

What I want, is to be able to select a checkbox, then click an image which then changes the 'src' of the image with the value of the checked checkbox.
AND if it's not too much to ask, i also need help with transferring the image src'es into a text box..
But It's more important that I get the "checkbox-to-image-src" part working.. so please help me with that first.

!

I've accomplished similar scripts, but much, much simpler..

Here's the "vibe" and the basic idea of the code i want:

HTML Code:

<!-- start code
<HTML>
<HEAD>
<TITLE>test</TITLE>
<script>
fuction CHK() {
var CHECKNAME = "checkbox.checked=true";                // Find checkbox which is checked - need serious help here..
var EXT = ".gif";                                       // Image file-type to be used in final replacement src
this.src="document.form1.'+ CHKNAME +'.value+EXT";      // Gets value from checkbox, and uses as img.src (replaces the image
}

function CONVERT() {
var sep = ","
CODEBOX.value="document.IMG0.src+sep+document.IMG1.src+sep+document.IMG2.src+sep+document.IMG3.src"  // Basically gets all the image's src, seperated by commas, and get put into the CODEBOX textbox
}

</script>
</HEAD>
<BODY>
<form name=form1>
<img src=0.gif id=IMG0 onclick="CHECK()"><img src=0.gif id=IMG1 onclick="CHECK()"><img src=0.gif id=IMG2 onclick="CHECK()"><img src=0.gif id=IMG3 onclick="CHECK()"><br>
<input type=checkbox value=0 name=chk1>0<input type=checkbox value=1 name=chk2>1<input type=checkbox value=2 name=chk1>2<input type=checkbox value=3 name=chk1>3<br>
<input type="text" id=CODEBOX value=""><input type=submit value="get code" onclick="CONVERT()">
</form>
</BODY>
</HTML>
<!-- end code

If anyone can help me in anyway at all, even just a little, it would help me SO much.
i just to get started with it.

MUCH APPRECIATED!!!

**chrishirst** · 11-22-2008, 08:08 AM

use the [ code] tags in future please.

use quotes (") around ALL your attribute values
Make sure the function you call (onclick="CHECK()") matches the function you define (fuction CHK())
use a correct script open tag (<script type="text/javascript">

only checkboxes that ARE checked will have a value

And if I have time later I'll look at the code

**softhink** · 11-28-2008, 01:37 AM

so much problems.....
here is the right code

Quote:

<HTML>
<HEAD>
<TITLE>test</TITLE>
<script>
function CHECK(img){//your old function name does not math
//you should better use radio but not checkbox,because the image's src has only one URL
var CHECKVALUE="";
for(var i=0;i<document.form1.chk1.length;i++){
if(document.form1.chk1[i].checked){
CHECKVALUE=document.form1.chk1[i].value;break;
}
}
var EXT = ".gif"; // Image file-type to be used in final replacement src
img.src=CHECKVALUE+EXT; //"this" in the function stand for the function itself,so you should pass the image element.
alert(CHECKVALUE+EXT)
}
function CONVERT(){
var sep = ",";
document.getElementById("CODEBOX").value=document. getElementById("IMG0").src+sep+document.getElement ById("IMG1").src+sep+document.getElementById("IMG2 ").src+sep+document.getElementById("IMG3").src ; // Basically gets all the image's src, seperated by commas, and get put into the CODEBOX textbox
}
</script>
</HEAD>
<BODY>
<form name=form1>
<img src=0.gif id=IMG0 onclick="CHECK(this)"><img src=0.gif id=IMG1 onclick="CHECK(this)"><img src=0.gif id=IMG2 onclick="CHECK(this)"><img src=0.gif id=IMG3 onclick="CHECK(this)"><br>
<input type=radio value=0 name=chk1>0<input type=radio value=1 name=chk1>1<input type=radio value=2 name=chk1>2<input type=radio value=3 name=chk1>3<br>
<input type="text" id=CODEBOX value=""><input type=button value="get code" onclick="CONVERT()">
</form>
</BODY>
</HTML>