473,411 Members | 2,184 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,411 software developers and data experts.

Dropdown as div contents

Fary4u
273 100+
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/...M/areaid//sts/
Jul 22 '10 #1

✓ answered by 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.

7 2732
acoder
16,027 Expert Mod 8TB
The problem isn't quite clear. Could you explain with a bit of code please.
Jul 23 '10 #2
Fary4u
273 100+
@acoder
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/...J/areaid//sts/

available color & size are shown as div list & passing value & swaping the image.
Expand|Select|Wrap|Line Numbers
  1. <select name="cbo" class="styled"> 
  2.   <option value="1">Option 1</option> 
  3.   <option value="2">Option 2</option> 
  4.   <option value="3">Option 3</option> 
  5. </select> 
  6.  
Jul 24 '10 #3
acoder
16,027 Expert Mod 8TB
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?
Jul 24 '10 #4
Fary4u
273 100+
@acoder
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/...J/areaid//sts/
Jul 24 '10 #5
acoder
16,027 Expert Mod 8TB
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.
Jul 27 '10 #6
Fary4u
273 100+
@acoder
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.QueryString("drpcolor")

Expand|Select|Wrap|Line Numbers
  1.  
  2. <SCRIPT language=JavaScript>
  3.     function reload(form){
  4.     var int1 = "<%= intProdID %>"
  5.     var int2 = "<%= intProdN %>"
  6.     var val=form1.drpcolor.options[form1.drpcolor.options.selectedIndex].value;
  7.     self.location='product_detail.asp?intProdID=' + int1 + '&intProdN=' + int2 + '&drpcolor=' + val ;
  8.     }
  9. </script>
  10. <select id="cboColours" name="drpcolor" onchange="reload(this.form)">
  11.     <option selected value="1">Make Selection</option>
  12.     <option selected value="1"><%= strprodcolor %></option>
  13.     <%=PopulateCombo(rsColours,"color_id","color_id")%>
  14. </select>
  15. <br>
  16. <select id="cboSizes" name="drpsize">
  17. <option selected value="1">Make Selection</option>
  18. <%=PopulateCombo(rsSizes,"size","stock")%>
  19. </select>
  20.  
  21.  
Jul 27 '10 #7
acoder
16,027 Expert Mod 8TB
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:
Expand|Select|Wrap|Line Numbers
  1. var colsizes = {"Black":["Small","Medium","Large"],
  2. }
Jul 27 '10 #8

Sign in to post your reply or Sign up for a free account.

Similar topics

1
by: Joseph Barron | last post by:
Here is a SIMPLE problem that I'm trying to solve. It works in Netscape 6.2, but IE6 gives ""No such interface supported." Below are page1.htm and page2.htm . In page1.htm, there are two...
5
by: sifar | last post by:
Hi, This is my first post to this Group. A] I am trying to create a escalation page which will mail an escalation report of a faulty product. Items needed on Page: -----------------------
4
by: Invalidlastname | last post by:
Hi, I have an XML document, created from ADO DataSet, which contains XML data in some nodes shown below: <NewDataSet> <Table> <field_name>My Selection</field_name>...
3
by: Jon | last post by:
I am using cascading dropdowns, where the selection in one determines what fills another. In regular ASP I simply loaded a giant dataset into javascript array and when you clicked on one dropdown,...
2
by: Mike P | last post by:
I am populating a drop down column in a datagrid on page load. Here is my code : <asp:TemplateColumn> <ItemTemplate> <asp:DropDownList ID="ddlUserName" Font-Name="Verdana" Font-Size="8pt"...
2
by: Mike Collins | last post by:
I cannot get the correct drop down list value from a drop down I have on my web form. I get the initial value that was loaded in the list. It was asked by someone else what the autopostback was...
1
by: Oleg | last post by:
Hi, I'm having a problem with page caching and therefore reusing dropdown box contents. Scenerio: user1 has security to see list of three items(.aspx populates it with three items only) in...
2
by: Peter | last post by:
ASP.NET 2003 In the DataGrid how do I select current cell value in the dropdown box when I click on the edit link, currently when I click on the edit link in the DataGrid the dropdown box...
0
by: gwhite1 | last post by:
OK, this seemed like a simple application a week ago. I have loaded a gridview from a sqlserver DB and have a template column with a dropdown field. I want the user to be able to dropdown the field...
13
by: Shutey | last post by:
I have a strange issue with dropdowns. Using php4, mySQL5, Apache 2 on a fast XP pro PC, I have a form which requires 5 dropdowns populated with indentical values. I extract the values using SQL...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...
0
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.