Redirect with HTML dropdown select - php

I have a simple HTML drop-down select box.
I would like this to function as 'once something is selected' > the page then redirects to a custom URL.
Below is my mark-up.
<fieldset id="size"><legend>Product Options</legend>
<div class="wpsc_variation_forms">
<table>
<tr><td class="col1"><label for="variation_select_48_5">Choose Size:</label></td>
<td class="col2"><select class="wpsc_select_variation" name="variation[5]" id="variation_select_48_5">
<option value="0" >-- Please Select --</option>
<option value="8" >Large</option>
<option value="7" >Medium</option>
<option value="6" >Small</option>
</select></td></tr>
</table>
</div><!--close wpsc_variation_forms-->
</fieldset>
I found a similar question; but the solution given seems a bit clunky.
SELECT Dropdown that redirects without Javascript

With jQuery:
$(function() {
$('#variation_select_48_5').change(function() {
document.location = 'http://customurl.abc';
});
});

The easiest way i know of is assigning an onchange event to select element and making options' values as urls.
<select onchange="window.location = this.options[this.selectedIndex].value;">
<option value="http://your-url">Large</option>
</select>

I would write i litte function and then trigger it depending on the retuned result
<?PHP
function redirect($where){
header("Location: $where");
}
if ($_REQUEST['select1'] == '8'){
redirect('http://example.com/somewhere.php');
}elseif($_REQUEST['select1'] == '7'){
redirect('http://example.com/elsewhere.php');
}elseif($_REQUEST['select1'] == '6'){
redirect('http://example.com/elsewhere.php');
}
?>
<form>
<select name="select1" class="wpsc_select_variation" name="variation[5]" id="variation_select_48_5" onchange="this.form.submit()">
<option value="0" >-- Please Select --</option>
<option value="8" >Large</option>
<option value="7" >Medium</option>
<option value="6" >Small</option>
</select>
the only javascript required is within the select tag to trigger the submit onchange="this.form.submit()"

Hope this helps
$("select#wpsc_select_variation").change(function(){
if ($(this).val() !== 0) {
switch($(this).val())
{
case(8):
window.location.href = http://www.8.com
case(7):
window.location.href = http://www.7.com
case(6):
window.location.href = http://www.6.com
}
}
});

Related

Simple if else php form script for select menu

Can you help me on creating a simple php script using select menu with if and else statement?
I'm trying to create select menu that when i click the menu, it will redirect to another page.
Im really dumb in programming. I will be very grateful with your help. I'm hoping my statement is clear. Thanks in advance...
<td width="421">
<label>
<select name="journal" id="journal">
<option value="IN PROGRESS">IN PROGRESS</option>
<option value="PUBLISHED"></option>
<option value="NOT APPLICABLE">NOT APPLICABLE</option>
</select>
</label>
</td>
You cannot use php for this unless you use a form to submit the select value to a php script, use javascript or jquery to achieve what you want, here's a jquery solution:
jQuery(function () {
$("#journal").change(function () {
selectValue = $(this).val();
if(selectValue == "IN PROGRESS"){
location.href = "http://somesite.com";
}else if( selectValue == "PUBLISHED"){
location.href = "http://othersite.com";
}else if( selectValue == "NOT APPLICABLE"){
location.href = "http://anothersite.com";
}
})
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<td width="421">
<label>
<select name="journal" id="journal">
<option value="">Choose Status</option>
<option value="IN PROGRESS">IN PROGRESS</option>
<option value="PUBLISHED">PUBLISHED</option>
<option value="NOT APPLICABLE">NOT APPLICABLE</option>
</select>
</label>
</td>

Form Auto select to specific link subdomain

I am trying to make it so when you select an option, it goes to a specific subdomain. e.g. if coffee is selected, it should redirect to coffee.domain.com. This is what I have, it seems to work but doesn't go to a chosen subdomain
<form>
<select name='http://domain.com' onchange='this.form.submit()'>
<option selected>Select Option</option>
<option value="coffee">Coffee</option>
<option value="tea">Tea</option>
</select>
<noscript><input type="submit" value="Submit"></noscript>
</form>
The code you posted is just HTML. There is no code there to actually do what you want.
If you wanted to do this in PHP you could try something like
<?php
if(ISSET($_POST['domainSelect']) == 'coffee'){
header('Location: http://www.domain-coffee.com');
}
if(ISSET($_POST['domainSelect']) == 'tea'){
header('Location: http://www.domain-tea.com');
}
?>
<form method="POST">
<select name='domainSelect' onchange='this.form.submit()'>
<option selected>Select Option</option>
<option value="coffee">Coffee</option>
<option value="tea">Tea</option>
</select>
<noscript><input type="submit" value="Submit"></noscript>
</form>
Or you could do it with JavaScript by doing something like
<script type='text/javascript'>
function gotodomain(){
var e = document.getElementById('domainSelectId');
var strSelected = e.options[e.selectedIndex].value;
if(strSelected == 'coffee'){
document.location.href = 'http://domain-coffee.com'
}
if(strSelected == 'tea'){
document.location.href = 'http://domain-tea.com'
}
}
</script>
<form method="POST">
<select id="domainSelectId" name='domainSelect' onchange='gotodomain()'>
<option selected>Select Option</option>
<option value="coffee">Coffee</option>
<option value="tea">Tea</option>
</select>
<noscript><input type="submit" value="Submit"></noscript>
</form>
In either case I suggest you start thinking about what it is exactly you want and in what language its best to achieve in.

force option from <select> drop down before submit form

I want the user to be forced to select any option in the drop down apart from the default "selected" option
here is my drop down menu code;
<form><label>Select Tank:</label>
<select class="text2" name="tank" id="mySelect">
<option value="0" selected="selected">Select your tank</option>
<option value="4"> Tank#1 </option>
<option value="9"> Tank#2 </option>
<option value="21"> Tank#3 </option>
<option value="34"> Tank#4 </option>
</select>
<input type="button" id="btncheck" value="Submit"/>
</form>
and here is my java;
$('#btncheck').click(function(){
if ($("#mySelect ")[0].selectedIndex <= 0) {
alert("Please select a tank from the menu!");
return false;
}
});
jsfiddle: http://jsfiddle.net/36JZL/41/
for some reason it validates correctly but form isnt submitted.
You can do it with jQuery on client side but its not a good option to validate things on client side.
PasteBin: http://jsbin.com/zer/1
<form id="myForm">
<label>Select Tank:</label><br />
<select class="text" name="tank" id="tankSelector">
<option value="All" selected="selected"> Select Tank </option>
<?QUERY HERE TO PULL AND LOOP FROM DATABASE?>
<option value="<?php echo $row->id; ?>"> <?php echo $row->description; ?> </option>
<? END LOOP ?>
</select>
<input type="submit">
</form>
<script>
$(function() {
$('#myForm').submit(function(e){
if($('#tankSelector').val() == 'All') {
alert('Select tank!');
e.preventDefault();
}
});
});
</script>
<label>Select Tank:</label><br />
<select class="text" id="seltank" name="tank">
<option value="All" selected="selected"> Select Tank </option>
</select>
in the client side click event of your submit button add some javascript to check the value of your drop down.
if(document.getElementById("seltank").value == "All")
{
//put some code to alert the user or show error
return false; //this should prevent your post
}
Similar post is here How do I cancel form submission in submit button onclick event?
Here's what I do:
<select class="text2" name="tank" id="mySelect">
<option></option>
<option value="4"> Tank#1 </option>
<option value="9"> Tank#2 </option>
<option value="21"> Tank#3 </option>
<option value="34"> Tank#4 </option>
</select>
If the user hits submit without making a selection, they will be prompted to select an option automatically. The limitation is that you don't get a pretty little "select an option" placeholder.
Maybe this can help. Im yet to find a stable answer
If using php:
$val = $_POST['select_input']; <--- works fine
or
$val = $request->select_input <---- can be problematic
On Html
<select id="select_input" name="select_input" >
<option value="0">Pending</option>
<option value="1">Approved</option>
<option value="0" selected>Pending</option>
</select>

Get dropdown selected value and redirect that page on button click

i have a dropdown menu and a submit button.. i want that when i select English Language and cick on submit then i redirect page English.php.
here is my code.. but it is not working....
<?php $lang=$_REQUEST['language']; ?>
<form action="<?php echo $lang; ?>" method="Post">
<select name="language">
<option>select one</option>
<option>English</option>
<option>Hindi</option>
</select>
<input type="submit">
</form>
You need to specify a value in your option tag. However, it is not safe to let the user specify the script to run. So you you should examine the values from the form in your PHP code and decide where to send the user.
<?php
$lang=$_REQUEST['language'];
switch ($lang) {
case 'english':
$page = 'english.php';
break;
case 'hindi':
$page = 'hindi.php';
break;
default:
$page = null;
}
if ($page) {
header("Location: ".$_POST['language']);
exit;
}
?>
<form method="post">
<select name="language">
<option value="">select one</option>
<option value="english">English</option>
<option value="hindi">Hindi</option>
</select>
</form>
For that you must have value defined for option
<select name="language">
<option value="">select one</option>
<option value="English.php">English</option>
<option value="Hindi.php">Hindi</option>
</select>
above are HTML code now when form is posted redirect to selected option as below.
if(isset($_POST['submit']))
{
header("Location: ".$_POST['language']);
exit;
}
or you can change the action of the form by jQuery, like:
$('select[name="language"]').change(function(){
$('form').attr('action' , $(this).val())
});
Please find a more detailed approach
<script language="javascript">
function goPage() {
if (document.frm.language.value != '') {
document.frm.action = document.frm.language.value;
document.frm.submit();
}
}
</script>
<form name="frm" method="get">
<select name="language">
<option value="">select one</option>
<option value="English.php">English</option>
<option value="Hindi.php">Hindi</option>
</select>
<input type="button" value="Go" onclick="javascript:goPage()" />
</form>
by using javascript
html code:
<select name="dropdpown" size="1" id="select-anchor">
<option value="#link">foo</option>
<option value="#link">bar</option>
</select>
script code:
$(document).ready(function () {
$('#select-anchor').change( function () {
var targetPosition = $($(this).val()).offset().top;
$('html,body').animate({ scrollTop: targetPosition}, 'slow');
});
});
demo

I want the last selected option to be selected in my <select> form after the user selected the option

<form method="get" action="index.php">
<select name="choice" size="1" onchange="this.form.submit()">
<option value="a">a</option>
<option value="b">b</option>
<option value="c">C</option>
</select></form>
The code above displays a dropdown menu of options, such as a, b, or c, the user can click on. After the user clicks on a, b, or c from the drop down menu, that option is submitted in the form, and the page reloads with a new $_GET variable "choice" defined as a, b, or c. I want the option that the user last selected to now be the default selected option listed. For example, after the user clicks on "b" from the dropdown menu, "b" shows up as selected on the drop down menu list. What's the best way to accomplish this?
Here you go:
<?php
if (isset($_REQUEST['choice'])) {
$selected_choice = $_REQUEST['choice'];
}
else {
$selected_choice = "none";
}
?>
<html>
<head>
</head>
<body>
<form method="get" action="">
<select name="choice" size="1" onchange="this.form.submit()">
<option value="a" <?php if($selected_choice == "a"){ print "selected='selected'"; } ?> >a</option>
<option value="b" <?php if($selected_choice == "b"){ print "selected='selected'"; } ?> >b</option>
<option value="c" <?php if($selected_choice == "c"){ print "selected='selected'"; } ?> >C</option>
</select>
</form>
</body>
</html>
When outputting the form do a check like:
<option value="a"<?php if ($_GET['choice'] == "a") {?> selected <?php } ?>>a</option>
You'd then want to extract that into a function that either does the conditional code for you, or outputs the entire option element with the provided value, label, and sanitized data with the check done internally.
Another approach to avoid spaghetti code (or at least reduce it) is to set it through Javascript, like:
<html>
<body>
<form method="get" action="test.htm">
<select name="choice" id="choice" size="1" onchange="this.form.submit()">
<option value="a">a</option>
<option value="b">b</option>
<option value="c">c</option>
</select>
</form>
<script>
document.getElementById('choice').value = 'b';//replace with something like: <?php echo $_GET['choice'] ?>
</script>
</body>
</html>
IMHO this approach is better than put a test in each option tag.
Try saving the posted select option in session like below
<?php $_SESSION['current_select'] = $_REQUEST['posted_select_option']?>
And in page load check as below
<script>
var currentSelect = <?php echo $_SESSION['current_select']; ?>
$(document).ready(function(){
if(currentSelect!="")
$("#choice").val(currentSelect);
});
</script>
Considering your select tag has id like below
<select name="choice" id="choice" size="1" onchange="this.form.submit()">
<option value="a">a</option>
<option value="b">b</option>
<option value="c">C</option>
</select>

Categories