Jump to content
Sign in to follow this  
vj5

multiple drowpdown list

Recommended Posts

I have multiple dropdown list on a page and I want to click the first dropdown and the second dropdown should move down and give way to the first dropdown, when click on second dropdown, the third dropdown should move down and give way tot he second. Is it possible to do like I explained?

Share this post


Link to post
Share on other sites

do you want the drop downs to pyhsically move or do you mean you want to load the lower drop downs based on the selection of the drop down above it (i.e populate a state dro down after a country has been selected from the previous drop down)?

Share this post


Link to post
Share on other sites
do you want the drop downs to pyhsically move or do you mean you want to load the lower drop downs based on the selection of the drop down above it (i.e populate a state dro down after a country has been selected from the previous drop down)?
Physically move when the first dropdown is selected.When second dropdown is selected, the third should move and the first should close the selection.

Share this post


Link to post
Share on other sites

you will need to attach an onchange event handler in javascript to the dropdownlist like so

<asp:DropDownList ID="DropDownList1" runat="server" onchange="ddl1change()"/><br/><asp:DropDownList ID="DropDownList2" runat="server" onchange=""/>...<script type="text/javascript">  function ddl1change() {	//write your javascript code to move ddl2  }</script>

Share this post


Link to post
Share on other sites
you will need to attach an onchange event handler in javascript to the dropdownlist like so
<asp:DropDownList ID="DropDownList1" runat="server" onchange="ddl1change()"/><br/><asp:DropDownList ID="DropDownList2" runat="server" onchange=""/>...<script type="text/javascript">  function ddl1change() {	//write your javascript code to move ddl2  }</script>

Could you give an example of javascript code to write for dd12? where is the second dropdownlist onchange=""?

Share this post


Link to post
Share on other sites
you will need to attach an onchange event handler in javascript to the dropdownlist like so
<asp:DropDownList ID="DropDownList1" runat="server" onchange="ddl1change()"/><br/><asp:DropDownList ID="DropDownList2" runat="server" onchange=""/>...<script type="text/javascript">  function ddl1change() {	//write your javascript code to move ddl2  }</script>

I am gettting an error saying onchange is not valid asp.net control.

Share this post


Link to post
Share on other sites

I don't fully understand what you mean when you want the drop downs to move when an option is selected fromt he previos one.Try assigning the handlers this way.

<asp:DropDownList ID="DropDownList1" runat="server"/><br/><asp:DropDownList ID="DropDownList2" runat="server"/><br/><asp:DropDownList ID="DropDownList3" runat="server"/>...<script type="text/javascript">  //assign handlers  document.getElementById('<%= DropDownList1.ClientID %>').onchange = function() {	//you can use this.style to access the drop downs css properties to make it move	// use position, top, and left to move the dopr down  };  document.getElementById('<%= DropDownList2.ClientID %>').onchange = function() {  };  document.getElementById('<%= DropDownList3.ClientID %>').onchange = function() {  };  </script>

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...