www.webdeveloper.com
Results 1 to 7 of 7

Thread: dropdown selection determines redirect page

Hybrid View

  1. #1
    Join Date
    Apr 2006
    Posts
    4

    Question dropdown selection determines redirect page

    I would like to make a form with a drop down list.

    On selection of Item 1 from the menu I would like the page to direct to somepage1.html after the submit button is selected.

    On selection of Item 4 from the menu, I would like the page to direct to somepage4.html after the submit button is selected.

    On selection of any other item from the dropdown menu I would like the page to direct to somepage2.html after the submit button is selected.

    I'm a newbie at this and any help will be appreciated. Thank you very much!

  2. #2
    Join Date
    Jan 2006
    Location
    I'm in GMT -5
    Posts
    561
    Code:
    <html>
    <head>
    <script type="text/javascript">
    
    	function setAction(nPage){
    
    		document.forms[0].action = nPage;
    	}
    
    </script>
    </head>
    <body>
    
    <form>
    <select onchange="setAction(this.value)">
    <option value=''> Make a selection </option>
    <option value='somepage1.html'> Option 1 </option>
    <option value='somepage2.html'> Option 2 </option>
    <option value='somepage2.html'> Option 3 </option>
    <option value='somepage4.html'> Option 4 </option>
    </select>
    &nbsp;&nbsp
    <input type='submit' value="Submit">
    </form>
    
    </body>
    </html>

  3. #3
    Join Date
    May 2014
    Posts
    1
    Hii James,

    Above solution is working fine on my system locally, But when I tried to implement it on my wordpress site using WYGIWYS visual editor. it is not working. Dropdown menu is appearing but not redirect to webpages. it simply refreshes the same page on which dropdown list appear and url changes with ? ending on the same url as previous.

    can you please help me in how to implement dropdown list on my wordpress site.

    Thanks

  4. #4
    Join Date
    Apr 2006
    Posts
    4
    Thank you very much for your generous reply James.
    I tried your code and it works great. However, I need to get this to work within an .asp mailing redirect program... so that all the data from the form is sent to an email address and the user, gets redirected to another page after hitting submit.

    I finally found a previous post that sums up more distinctly what I need. I'm apologize for this extra post and will try to do better in the future to do a more thorough search before posting a new topic. mea culpa

    If anyone can help out with the issue it is summed up better here I think.

    http://www.webdeveloper.com/forum/sh...ad.php?t=21221

    Many thanks!

  5. #5
    Join Date
    Dec 2004
    Posts
    8,637
    Simple enough -- if the server-side page is not returning any results to the client. If it is, then you're pretty much outta luck. The solution is to use the FORM's onsubmit event to schedule (window.setTimeout) a JavaScript redirect (window.location.href='url') which then takes place *after* the FORM has been submitted to the server.

  6. #6
    Join Date
    Jan 2006
    Location
    I'm in GMT -5
    Posts
    561
    Code:
    <html>
    <head>
    <script type="text/javascript">
    
    	function validate(nForm){
    
    		if (nForm['redirectPage'].value == "")
    			{
    			 alert('Choose from the list');
    			 return false;
    			}
    		alert(nForm['mail_redirect'].value)
    	}	
    
    </script>
    </head>
    <body>
    
    
    <form action="formmail.asp" method="post" name="form1" onsubmit="return validate(this)">
    <input id="mail_to" type="hidden" name="mail_to" value="myemail@domain.com" /> 
    <input id="mail_redirect" type="hidden" name="mail_redirect" value="submititem1.htm" />
    <input id="mail_send" type="hidden" name="mail_send" value="y" />
    <br><br>
    <select name='redirectPage' onchange="this.form['mail_redirect'].value=this.value">
    <option value=''> Make a selection </option>
    <option value='somepage1.html'> Option 1 </option>
    <option value='somepage2.html'> Option 2 </option>
    <option value='somepage2.html'> Option 3 </option>
    <option value='somepage4.html'> Option 4 </option>
    </select>
    &nbsp;&nbsp
    <input type='submit' value="Submit">
    </form>
    
    </body>
    </html>

  7. #7
    Join Date
    Jun 2008
    Location
    Europe
    Posts
    1,097

    Lightbulb

    For Wordpress, sometimes it helps to 'break' 'the loop'.

    Try using a plugin like "Raw HTML", then putting the tags around your script.

    HTML Code:
    [raw]
    <!-- Script you want to work in Wordpress HERE -->
    [/raw]
    There is actually a site where you can get every kind of dropdown combobox you want... even ones for wordpress. Click on the link below:

    Drop Down Combo Box site
    Last edited by donatello; 05-23-2014 at 07:20 AM. Reason: Fixing formatting

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles