I have a registration form where I want to be able to get the account plan users have selected form another page and will autofill my form for account type.
The a href from the pricing site
signup.php?type=free
signup.php?type=pro
signup.php?type=plus
Code for the form in registration site
<form class="form-signin" action="pricing.php" method="get">
<div class="form-group">
<label for="type">Account Type</label>
<select class="form-control" id="type">
<option value="free">Free</option>
<option value="pro">Pro</option>
<option value="plus">Plus</option>
</select>
</div></form>
This will get the $_GET['type'] variable & set selected attribute for the drop down! You could also do it with jQuery (seen below)
<?php
if(isset($_GET['type'])){
$type = $_GET['type'];
}
?>
<form class="form-signin" action="pricing.php" method="get">
<div class="form-group">
<label for="type">Account Type</label>
<select class="form-control" id="type">
<option <?php if($type == 'free'){ echo "selected='selected'"; } ?> value="free">Free</option>
<option <?php if($type == 'pro'){ echo "selected='selected'"; } ?> value="pro">Pro</option>
<option <?php if($type == 'plus'){ echo "selected='selected'"; } ?> value="plus">Plus</option>
</select>
</div></form>
jQuery...
<?php if(isset($_GET['type'])){ ?>
<script>
$(document).ready(function(){
var type = "<?php echo $_GET['type'] ?>";
$("#type > option").each(function(){
if($(this).val() == type){
$(this).attr("selected", "selected")
}
})
})
</script>
<?php } ?>
Related
How do I pass the id value to the function?
What I am doing is, When the user changes the dropdown then it will get the value of dropdown and also get the input value which is hidden inside foreach.
I tried from my side I am getting on change the value from the dropdown but how do I get the input value in the jquery? now I am getting the last value of the input field.
$x=1;
foreach ($duration as $row) {?>
<input type="hidden" name="activeID" id="activeID<?php echo $x;?>" value="<?php echo $row->activity_name_id;?>">
<select name="Duration<?php echo $x;?>" class="form-control" id="Duration<?php echo $x;?>">
<option selected disabled >Select year</option>
<option value="12m" <?php if($row->Duration == '12m' ){ echo 'selected="selected"'; } ?>>1 Year</option>
<option value="6m" <?php if($row->Duration == '6m' ){ echo 'selected="selected"'; } ?>>6 months</option>
</select>
<div id="results<?php echo $x;?>"></div>
<?php $x++;}
jquery
$('[id^="Duration"]').change(function () {
var a=$('input[id^="activeID"]').attr('id');// how to I display the input id here
alert(a);
var value = $('input[id^="activityID"]').val();// i tried this one as well
alert(value);
var end = this.value;
alert(end);//getting drodpown id value
});
You can put your input and select inside a div. When the dropdowns are changed, get the input sibling
<?php
$x=1;
foreach ($duration as $row) {
?>
<div>
//Your input and select here
</div>
<?php } ?>
<script>
$('[id^="Duration"]').change(function () {
var input = $($(this).siblings("input")[0]); // get the input element
var id = input.attr("id"); //id of the input
var value = input.val(); //value of the input
alert(value);
});
</script>
One thing I have observed in your code:
$x=1;
foreach ($duration as $row) {
<input type="hidden" name="activeID" id="activeID<?php echo $x;?>" value="<?php echo $row->activity_name_id;?>">
<select name="Duration<?php echo $x;?>" class="form-control" id="Duration<?php echo $x;?>">
<option selected disabled >Select year</option>
<option value="12m" <?php if($row->Duration == '12m' ){ echo 'selected="selected"'; } ?>>1 Year</option>
<option value="6m" <?php if($row->Duration == '6m' ){ echo 'selected="selected"'; } ?>>6 months</option>
</select>
<div id="results<?php echo $x;?>"></div>
}
You are not at all increasing $x anywhere and hence each and every hidden input tag is getting id = 'activeId1'
<?php
$x=1;
foreach ($duration as $row) {
?>
<input type="hidden" name="activeID" id="activeID<?php echo $x;?>" value="<?php echo $row->activity_name_id;?>">
<select name="Duration<?php echo $x;?>" class="form-control DurationClass" id="Duration<?php echo $x;?>">
<option selected disabled >Select year</option>
<option value="12m" <?php if($row->Duration == '12m' ){ echo 'selected="selected"'; } ?>>1 Year</option>
<option value="6m" <?php if($row->Duration == '6m' ){ echo 'selected="selected"'; } ?>>6 months</option>
</select>
<div id="results<?php echo $x;?>"></div>
<?php } ?>
<script>
$('.DurationClass').change(function () {
var a=$('input[id^="activeID"]').attr('id');
var selectID=$(this).attr('id');
//alert(a);
var value = $(this).val(); // in loop every dropdown select current option value return
alert(value);
});
</script>
You can use onchange event in your HTML part of the code
$x=1;
foreach ($duration as $row) {?>
<input type="hidden" class="activeID" name="activeID" id="activeID<?php echo $x;?>" value="<?php echo $row->activity_name_id;?>">
<select name="Duration<?php echo $x;?>" onchange="myfunction();" class="form-control" id="Duration<?php echo $x;?>">
<option selected disabled >Select year</option>
<option value="12m" <?php if($row->Duration == '12m' ){ echo 'selected="selected"'; } ?>>1 Year</option>
<option value="6m" <?php if($row->Duration == '6m' ){ echo 'selected="selected"'; } ?>>6 months</option>
</select>
<div id="results<?php echo $x;?>"></div>
<?php $x++;}
Here is the function
function myfunction () {
alert($(this).parent()); //what are you getting
alert($(this).parent().find(".activeID").value()); //what are you getting?
alert("Id of the select box is "+ this.id);
alert("Value of the select box is "+this.value );
};
$(".select").change(function(){
alert("Id of the select box is "+ this.id);
alert("Value of the select box is "+this.value );
});
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<h2>Form control: select</h2>
<p>The form below contains two dropdown menus (select lists):</p>
<form>
<div class="form-group">
<label for="sel1">Select list (select one):</label>
<select class="form-control select" id="Sell">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
<label for="sel1-item">Select list sell item (select one):</label>
<select class="form-control select" id="Sell-item">
<option>car</option>
<option>bike</option>
<option>cycle</option>
<option>auto</option>
</select>
</div>
</form>
</div>
</body>
</html>
I'm having a hard time to fix and how can make my codes work well.
My textbox echo correctly while my dropdown box is not.
Can anyone help me and also clean my codes?
I wanna know how did you do it and can u please explain it to me.
Thank you so much.
index.php
<?php include 'test.php' ?>
<form method="post" action="index.php">
Textbox: <input type="text" name="txt1" value="<?php echo $txt1;?>">
Dropdown: <select name="drpdown1" value="<?php echo $drpdown1;?>">
<option></option>
<option value="1">Mark</option>
<option value="2">Extreme</option>
</select>
<input type="submit" name="btn1">
</form>
test.php
<?php
$txt1 = "";
$drpdown1 = "";
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$txt1 = $_POST["txt1"];
$drpdown1 = $_POST["drpdown1"];
}
?>
You're not echoing the value of $drpdown1 correctly:
// this is wrong for a select:
<select name="drpdown1" value="<?php echo $drpdown1;?>">
// etc.
If you want to select automatically the previously selected value, you need to add the selected attribute:
<select name="drpdown1">
<option value="1" <?php if ($drpdown1 === '1') { echo "selected='selected'"; } ?>>Mark</option>
<option value="2" <?php if ($drpdown1 === '2') { echo "selected='selected'"; } ?>>Extreme</option>
// etc.
you have to know more about the dropdown box because you can not put the value inside the
<select value="<?php echo $drpdown1;?>">
you have to compare the value inside the option directly. example
<select name="drpdown1">
<?php
if($drpdown1 == ""){
?>
<option selected></option>
<option value="1">Mark</option>
<option value="2">Extreme</option>
<?php
}else if($drpdown1 == "1"){
?>
<option></option>
<option value="1" selected>Mark</option>
<option value="2">Extreme</option>
<?php
}
?>
</select>
I have a form with this drop list
<select name="status" class="form-control" style="width:100px; float:left;">
<option value="0" <?php if($status == 0)echo 'selected="selected"';?>></option>
<option value="1" <?php if($status == 1)echo 'selected="selected"';?>>Present</option>
<option value="2" <?php if($status == 2)echo 'selected="selected"';?>>Absent</option>
</select>
I want to change background color like this if Present is selected its green and when absent is selected its red.
Can someone please guide.
Regards,
actually you are setting selected data by getting value from php so everytime when the script loads it have to trigger the change event of the select box so that the latest color automatically get changed here is the snippet for you rest you can use PHP in option to echo selected;
$(document).ready(function() {
$('[name="status"]').trigger('change');
$('[name="status"]').change(function(){
if ($(this).val() == '1') {
$('#back_color').css('background-color','green');
} else if ($(this).val() == '2') {
$('#back_color').css('background-color','red');
}
}) ;
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<select name="status" class="form-control" style="width:100px; float:left;">
<option value="0">Select Color</option>
<option value="1" >Present</option>
<option value="2" >Absent</option>
</select>
<div id="back_color">dddd</div>
for some reasons i have removed php tags from your code but you can re-insert them now.
Regards
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<select name="status" class="form-control" style="width:100px; float:left;">
<option value="0" <?php if($status == 0)echo 'selected="selected"';?>></option>
<option value="1" <?php if($status == 1)echo 'selected="selected"';?>>Present</option>
<option value="2" <?php if($status == 2)echo 'selected="selected"';?>>Absent</option>
</select>
<div id="back_color">dddd</div>
<script>
$(document).ready(function(){
$('[name="status"]').change(function(){
if ($(this).val() == '1') {
$('#back_color').css('background-color','green');
} else if ($(this).val() == '2') {
$('#back_color').css('background-color','red');
}
}) ;
});
</script>
You can do it with CSS
CSS:
.opt-absent.selected {
background-color: red;
}
.opt-present.selected {
background-color: green;
}
Just echo a class with php with your conditions
<select name="status" class="form-control" style="width:100px;float:left;">
<option value="0" <?php if($status == 0)echo 'selected="selected"';?>></option>
<option value="1" <?php if($status == 1)echo 'selected="selected"';?> class="opt-present <?php if($status == 1)echo 'selected';?>">Present</option>
<option value="2" <?php if($status == 2)echo 'selected="selected"';?> class="opt-absent <?php if($status == 2)echo 'selected';?>">Absent</option>
</select>
you can do this way by using only php:
<?php
error_reporting(E_ALL);
$val=$_POST['abprt'];
?>
<html>
<head>
<style type="text/css">
#colorChange
{
padding:20px;
<?php
switch($val)
{
case 'pre':
echo "background-color:green;";
break;
case 'abs':
echo "background-color:red;";
break;
default:
echo "background-color:white;";
}
?>
}
</style>
</head>
<body>
<div id="colorChange">
<form method="post" action="test3.php">
<select name="abprt" >
<option value="pre" >Presnt</option>
<option value="abs">Absent</option>
<input type="submit" name="submit">
</select>
</form>
</div>
</body>
</html>
or trigger submit using js while hiding the submit button..
or you can go for jquery, which will be a bit complicated..
Try with jquery -
$('.form-control').on('change', function() {
if ($(this).val() == 1) {
$(this).css('background-color', 'green');
} else if ($(this).val() == 2) {
$(this).css('background-color', 'red');
} else {
$(this).css('background-color', 'white');
}
})
Add the jquery library before applying it.
DEMO
May be this will help you.
<?php if($status == 1): ?>
<select name="status" class="form-control" style="width:100px; float:left;background-color:green;">
<option value="1" selected>Present</option>
<option value="2" >Absent</option>
<?php else: ?>
<select name="status" class="form-control" style="width:100px; float:left;background-color:red;">
<option value="1" >Present</option>
<option value="2" Selected>Absent</option>
<?php endif; ?>
</select>
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
im new to php.i created a page in php containing chk boxes ,input fields and retrive the data from the database(mysql) and also use the javascript.
i h've a problem in this ,that is i want to display the output in the same page.
i created the code like this,i want the output in same page,but it shows error.
<?php
if(isset($_POST['submit']))
{
$con=mysql_connect("localhost","demosdef_review","review123");
if(!$con)
{
die('could nt connect 2 the server');
}
mysql_select_db("demosdef_review", $con);
$state = $_POST["state"];
$country = $_POST['country'];
$contry = "USA";
if($country==1)
{
$result = mysql_query("SELECT address FROM storelocator WHERE countryid='1' AND id='$state'");
$row = mysql_fetch_array($result);
echo $row['address'];
}
else
{
$result = mysql_query("SELECT address FROM storelocator WHERE countryid='$country'");
$row = mysql_fetch_array($result);
echo $row['address'];
}
}
?>
enter code here
<div class=buy>
Dealer Enquiry
</div><br/>
<div class=buyfont>Authorized Retailers</div>
<div><img src="images/archivers.png"><br/>
<a href="http://www.archiversannex.com/Books-And-SoftwareSoftware-And-Accessoriesdefault.aspx?PageID=20&CategoryID=48"/>
<img src="images/logo_archivers_annex.png" ></a><br/><br/>
<br/><br/>
</div><br/>
<form method="POST" action="<?php echo $_SERVER['PHP_SELF']; ?>
<p>
<label for="country" style="padding-right: 2px;">Country</label><select name="country" value="countryid"
id="countryid"
onchange="sub()" style="width:120px;">
<option value="1">USA</option>
<option value="2">CANADA</option>
<option value="3">UK</option>
<option value="4">AUSTRALIA</option>
<option value="5">ITALY</option>
<option value="6">GUATEMALA</option>
<option value="7">NEW ZEALAND</option></select></p>
<p>
<label for="state" style="padding-right: 14px;">State</label>
<select id="state" name="state" value="state" style="width:120px">
<option value="7">Alabama</option>
<option value="8">Alaska</option>
<option value="9">Arizona</option>
<option value="10">Arkansas</option>
<option value="11">California</option>
<option value="12">Colorado</option>
<option value="13">Connecticut</option>
<option value="43">Florida</option>
<option value="14">Georgia</option>
<option value="15">Idaho</option>
<option value="16">Illinois</option>
</select></p> <br/>
<input class="dealer-submit" type="submit" value="Submit" onClick="buy_func()"/>
</form>
<script type="text/javascript">
function sub()
{
var x=document.getElementById("countryid").selectedIndex;
var y=document.getElementById("countryid").options;
var z = document.forms[0].state;
if(y[x].index==0){
z.disabled = false;}
else if(y[x].index>0) {
z.disabled = true;}}
</script>
Your HTML markup has an error
<a href="http://www.hobbylobby.com/storelocator"/>
It should be
<a href="http://www.hobbylobby.com/storelocator">
Also try
<form method="POST" action="">
Keeping the action blank will post it to the same page itself
And replace your submit button with this
<input class="dealer-submit" type="submit" name="submit" value="Submit" onClick="buy_func()"/>
Check the value of the submit button, if its set isset($_GET('submit')) then display the results
does that solve your problem?
submit is the type of the element, 'Submit' is the value you are looking for:
<?php
if(isset($_POST['Submit']){
}
?>
Remove the backslash at the end of the line:
<a href="http://www.hobbylobby.com/storelocator"/>
^