Dropdown as div contents

[Fary4u]

using standard dropdown box make as div contents & after click on the link to passing value & changing the color ?

for example
div color & size

http://www.misssixty.com/item/store/MISS+SIXTY/tskay/D8B8AE0C/rr/1/cod10/34155763NM/areaid//sts/

[acoder]

The problem isn't quite clear. Could you explain with a bit of code please.

[Fary4u]

The problem isn't quite clear. Could you explain with a bit of code please.

how do i change div, href or radio box instead of drop down lists

if i need to convert dropdown values into div or radio box & passing value to the next page whats the best available fancy methods ?

following link having the same option

http://www.misssixty.com/item/store/MISS+SIXTY/tskay/D8B8AE0C/rr/1/cod10/34158646TJ/areaid//sts/

available color & size are shown as div list & passing value & swaping the image.

<select name="cbo" class="styled"> 
  <option value="1">Option 1</option> 
  <option value="2">Option 2</option> 
  <option value="3">Option 3</option> 
</select>

[acoder]

OK, you can use divs or other elements instead of form elements and attach an onclick event handler which deals with the setting and passing of values.

For example, you could set a hidden field if a particular div is clicked, or you could change the href of a link.

What exactly do you want to do?

[Fary4u]

OK, you can use divs or other elements instead of form elements and attach an onclick event handler which deals with the setting and passing of values.

For example, you could set a hidden field if a particular div is clicked, or you could change the href of a link.

What exactly do you want to do?

thxs for reply, i'm trying to bring 2 type of list i've already got the list in dropdown.

1st list:
colors : Black | White | Red | Green

2nd list:
sizes : Small | Medium | Large | Xtra Large

& some body click on the Black Color it's show's Black Image & bring the 2nd list

or if some body click on Red color it's show's Red Image & bring the 2nd list

Image should be JQuery Zoom effect just like the following link.

http://www.misssixty.com/item/store/MISS+SIXTY/tskay/D8B8AE0C/rr/1/cod10/34158646TJ/areaid//sts/

[acoder]

You can convert the drop down values to the divs using JavaScript, so that if JavaScript is not enabled the user can still select their options.

Take the select element and its options and write a div which is styled appropriately for each option, so the first list would be converted to 4 divs with the values/colours of Black, Red, White and Green.

[Fary4u]

You can convert the drop down values to the divs using JavaScript, so that if JavaScript is not enabled the user can still select their options.

Take the select element and its options and write a div which is styled appropriately for each option, so the first list would be converted to 4 divs with the values/colours of Black, Red, White and Green.

any example ? here is my example ?
when you select the 1st dropdown using request query string taking value & pass it to 2nd dropdown.
strprodcolor = Request.QuerySt ring("drpcolor" )

<SCRIPT language=JavaScript>
	function reload(form){
	var int1 = "<%= intProdID %>"
	var int2 = "<%= intProdN %>"
	var val=form1.drpcolor.options[form1.drpcolor.options.selectedIndex].value;
	self.location='product_detail.asp?intProdID=' + int1 + '&intProdN=' + int2 + '&drpcolor=' + val ;
	}
</script>
<select id="cboColours" name="drpcolor" onchange="reload(this.form)">
	<option selected value="1">Make Selection</option>
	<option selected value="1"><%= strprodcolor %></option>
	<%=PopulateCombo(rsColours,"color_id","color_id")%>
</select>
<br>
<select id="cboSizes" name="drpsize">
<option selected value="1">Make Selection</option>
<%=PopulateCombo(rsSizes,"size","stock")%>
</select>

[acoder]

There's no need to reload the page. You can do this without a page reload by loading the sizes on page load, e.g. something like:

var colsizes = {"Black":["Small","Medium","Large"],
}