Javascript for comma seperated list to radio buttons

Printable View

09-17-2010, 11:11 AM
lilpete

Javascript for comma seperated list to radio buttons

Hi Guys and Girls,

I am not sure if I am being cheeky here but I need some Javascript written for me as I dont have the skills to do it.

Here is the problem:
I have a comma seperated list of sizes and I need to get from that a radio button group to select a size.
Page is here:-
http://www.test.steptoes.co.uk/produ...ZT1ONDAw.ghtml

That is the way the sizes are stored in the database, they are called with a little bit of code in the original HTML: [_own Size_]

Code:

<div id="sizes"> [_own Size_]<br /><br /> <input type="submit" name="action" value="Add to Basket" class="button"> </div>

Is there any chance someone could find the time to write me such a script?
I did have a similar one to turn it into a list, but it was not written by me:-

Code:

function changeSize(list,item) { var id = item.options[item.selectedIndex].value; var sizes = document.getElementById("sizes_" + id).value; sizesArray = sizes.split(","); //id = sizesArray.splice(0,1); //item.options[item.selectedIndex].value = id; list.length = 0; list[0] = new Option("Choose",""); for (n=0;n<sizesArray.length;n++){ list[n+1] = new Option(sizesArray[n],sizesArray[n]); } list.focus() }

Any help on this would much appreciated.
Best Regards,
Pete
09-17-2010, 11:42 AM
vwphillips

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title></title> </head> <div id="Sizes1" ></div> <body> <script type="text/javascript"> /*<![CDATA[*/ var sizesArray=[36,37,38,39,40,41,42]; function MySizes(id,ary){ var obj=document.getElementById(id); for (var ip,z0=0;z0<ary.length;z0++){ ip=zxcFormField('INPUT',id+'Size','radio'); ip.value=ary[z0]; ip.style.marginRight='10px'; obj.appendChild(document.createTextNode(ary[z0])); obj.appendChild(ip); } } function zxcFormField(tag,nme,type){ var el; try { el=document.createElement('<'+tag+(type?' type='+type:'')+' name='+nme+' >'); } catch (e){ el=document.createElement(tag); if (type) el.type=type; el.name=nme; } return el; } MySizes('Sizes1',sizesArray) /*]]>*/ </script> </body> </html>
09-17-2010, 12:43 PM
lilpete

Hi Vic,

Awesome, it works, but then the script is repeated as you go down the page so it only works for the first item on the page.

http://www.test.steptoes.co.uk/produ...ZT1ONDAw.ghtml

I can use this little insert : [_var c_]
Basically that will read as 1 in the first item, 2 in the second and 3 in the third and so on,
so if it is a unique identifier you need each time the script is used then this might be the thing to use.

Thank you for your time.
Best regards,
Pete
09-17-2010, 01:30 PM
vwphillips

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title></title> </head> <div id="Sizes1" >Sizes1<br /></div> <div id="Sizes2" >Sizes2<br /></div> <body> <script type="text/javascript"> /*<![CDATA[*/ function MySizes(id,ary){ var obj=document.getElementById(id); for (var ip,z0=0;z0<ary.length;z0++){ ip=zxcFormField('INPUT',id+'Size','radio'); ip.value=ary[z0]; ip.style.marginRight='10px'; obj.appendChild(document.createTextNode(ary[z0])); obj.appendChild(ip); } } function zxcFormField(tag,nme,type){ var el; try { el=document.createElement('<'+tag+(type?' type='+type:'')+' name='+nme+' >'); } catch (e){ el=document.createElement(tag); if (type) el.type=type; el.name=nme; } return el; } var sizesArray1=[36,37,38,39,40,41,42]; var sizesArray2=[36,37,38,39,40]; MySizes('Sizes1',sizesArray1) MySizes('Sizes2',sizesArray2) /*]]>*/ </script> </body> </html>