First Select
<Select id="drop1" onchange="drop1(this.value)">
<option value ='1'>1</option
<option value ='2'>2</option
<option value ='3'>3</option
</select>
<div id = "txtHint1"></div>
Once a value has been selected, the value will be sent to ajax. And corresponding dropdown will be generated on another page and show in div txthint1.
Second Select
<Select id="drop2" onchange="drop2(this.value)">
<option value ='111'>111</option
<option value ='222'>222</option
<option value ='333'>333</option
</select>
<div id = "txtHint2"></div>
As the generated dropdown is another php page, how can I get what the value the user has selected to show on my current page (div txthint2)?
I will be working in php.
$value = $_GET['a'];
There are no submitted button.
Send out the second request on a successful response:
function one() {
$.ajax({
...
success: function() {
two(TheValueFromOne);
}
});
}
function two() {
$.ajax({
...
});
}
What is happening is that once the request has been made successfully, then it is automatically starting the next request right after.
However, if you are jsut passing values around form one page to another you really do not need AJAX.
FOR EXAMPLE:
test1.php:
<form action="test2.php" method="get">
Book Title <br />
<input type="text" name="booktitle" /><br />
<input type="submit" name="submit" value=" - Update Database - " />
</form>
test2.php
<body>
<? echo $_GET["booktitle"]; ?>
</body>
IN YOUR CASE:
test1.php:
<Select id="drop1" name="test1">
<option value ='1'>1</option
<option value ='2'>2</option
<option value ='3'>3</option
</select>
test2.php
<Select id="drop1">
<option selected = "<? echo $_POST['test1']; ?>"></option>
<option value ='1'>1</option
<option value ='2'>2</option
<option value ='3'>3</option
</select>
#QUESTION:
<div id = "txtHint2"><? echo $_POST['test1']; ?></div>
#POSTING WITH FORM:
<form method="post" action="test2.php" >
<Select id="drop1" name="test1" onChange="this.parentNode.submit()">
<option value ='1'>1</option
<option value ='2'>2</option
<option value ='3'>3</option
</select>
</form>
Related
I want to keep the selected value after submitting the form. Because, in case of form errors, I want to keep the inputs not removed. It works from number 1 to 5. But the sixth option does not POST the value after submitting. It posts an empty field. Do you know why?
<script>
$(document).ready(function(){
$("#select").change(function(){
$("input[name='percent']").val($(this).val());
});
});
</script>
<select id="select" name="selector">
/*1*/ <option>Choose</option>
/*2*/ <option value="10% ">10% </option>
/*3*/ <option value="20% ">20% </option>
/*4*/ <option value="33% ">33% </option>
/*5*/ <option value="50% ">50% </option>
/*6*/ <option value=" <?php echo $_POST['selector']; ?> ">other</option>
</select>
<input type="text" name="percent" id="input"
<?php if(isset($_POST['selector'])) { echo "value=".$_POST['selector'].""; } else { echo "placeholder=\"Type in other options\""; } ?> >
"Other" is just the name displayed, the value being sent is $_POST['selector'] -- so if that's empty, and empty value is being sent!
I'd like to show up to 10 email fields to submit on the form but only by selecting options from 1 - 10.
<form action="" method="post" name="select">
<select name="row">
<option value=1">1</option>
...
<option value="10">10</option
<input type="submit" name="select">
</form>
The next form shows up depending on the selected form
<form name="secondform">
<?php ... ?> <!--for loop depending on the value above-->
<input name="email>
</form>
So you have your dropdown, submit that value to either self or another php script that contains this:
$selected = $_POST['select'];
for($i = 0; $i<$selected; $i++){
echo "<input type='text' name='email$i'>";
}
$selected is the value of the dropdown menu.
Now we have a for loop. It set's $i to zero then says while $i is less than the value of your drop down value, add 1 more to $i and run echo "<input type='text' name='email$i'>";
As you can see, I appended $i to to email so that each field has it's own unique name.
What you can do as well is do just as CP510 says and add onchange='this.form.submit()' to the select tag so it is submitted automatically and I would submit the form to the same page. This meaning set the action of the form of which the select menu is in to action="<?php echo $_SERVER['PHP_SELF']; ?>".
I would STRONGLY recommend learning jQuery for something like this.
Here's the jQuery (mostly just plain javascript) version of this... it's very similar:
Please make sure you put this in the head of your html file:
<script src="http://code.jquery.com/jquery-latest.min.js"
type="text/javascript"></script>
HTML:
<select id='selected' onchange='addFields();'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
<option value='4'>4</option>
<option value='5'>5</option>
<option value='6'>6</option>
<option value='7'>7</option>
<option value='8'>8</option>
<option value='9'>9</option>
</select>
Javascript:
function addFields(){
var selected = $('#selected').val();
for(var i = 0; i<selected; i++){
document.write('<input type="text" name="email' + i + '">');
}
}
I am trying to call a javascript function from the onchange attribute of the select tag ! My issue is that I am passing the name attribute of the select to the function which always go null.
<body>
<form action="" method="post">
<select name="slct" id="name" onchange="rohan('measurement_conversion', '<?php echo isset($_POST["slct"])?$_POST["slct"]:"null" ?>')">
<option value="yes" selected="selected"> yes </option>
<option value="nopes"> nopes </option>
<option value="may be"> May be </option>
<option value="dont know"> dont know </option>
</select>
</form>
<div id="abc">
</div>
</body>
And here my javascript function
<script>
function rohan(var1, var2)
{
document.getElementById("abc").innerHTML=var1 + " " + var2;
}
</script>
It always prints null..
Any help will be appreciated !
HTML:
<body>
<form action="" method="post">
<select name="slct" id="name" onchange="rohan(this.value)">
<option>Select</option>
<option value="yes" selected="selected"> yes </option>
<option value="nopes"> nopes </option>
<option value="may be"> May be </option>
<option value="dont know"> dont know </option>
</select>
</form>
</body>
JS:
<script>
function rohan(value)
{
//you can get the value from arguments itself
alert(value);
}
</script>
PHP is run on the server before JavaScript is ever run in the browser. It doesn't get re-evaluated when the user changes the selected item.
No put in tag HTML attribute javascript, onchange is better in the script:
<script>
var b=document.getElementById('name');
b.onchange=function (){
var a=document.getElementById('name').value;
console.log(a);
}
</script>
I want to reload my page (PHP) on changing value from the dropdownmenu and passing the value of selected item as a variable alongwith one another variable to the page. I have tried following -
<select name="application" onChange=Refresh(this.value,$query)" \>
<option>Any Application</option>
<option>ChIP</option>
<option>Enzyme Immunoassay</option>
<option>ELISA</option>
<option>Flow Cytometry</option>
<option>FACS</option>
</select>
The Refresh function is:
function Refresh(id,gene){
location.href="getnet.php?app=" + id + "&query=" + gene;
}
And i am receiving variables as:
$query = $_POST['gene'];
$app = $_POST['application'];
you must use form submit() method in onchange event of the dropdown and hidden field for second parameter, for example:
<form name="myForm" method="GET" action="<?php echo $_SERVER['PHP_SELF'];?>">
<select name="first" onChange="document.myForm.submit();">
<option value="1">Value 1
<option value="2">Value 2
<option value="3">Value 3
</select>
<input type="hidden" name="second" value="second parameter value"/>
</form>
On the server side you can get your variables in $_GET supperglobal array like:
$_GET['first'] - it's value from dropdown element and $_GET['second'] - second hidden param.
Try to write js function for dropdown onchange event. Below is sample code:
<script type="text/javascript">
function reload_url(val){
window.location.href = 'some_php_file.php?new_var='.val;
}
</script>
<select name="my_Sel" onchange="reload_url(this.value);">
<option value="1">1</option>
<option value="2">2</option>
</select>
What about trying a form submit onChange?
<form name="form" action="url" method="get">
<select name="application" onChange="this.form.submit();" >
<option>Any Application</option>
<option>ChIP</option>
<option>Enzyme Immunoassay</option>
<option>ELISA</option>
<option>Flow Cytometry</option>
<option>FACS</option>
</select>
<input type="hidden" name="gene" value="variable" />
</form>
I have dropdown list (menu) and a button created with this code:
<form name="period" action="all.php" method="POST">
<div align="center">
<select name=period_dropdown>
<option value="nill"></option>
<option value="48">48</option>
<option value="72">72</option>
<option value="96">96</option>
<option value="120">120</option>
</select>
<input type="submit" value= "OK" >
</div></form>
When option of dropdown is selected, must be on button instead of OK and when button is pressed to be assigned to variable $period1. So, when I select 72, button must have 72 instead of OK and when I click button, variable $period1 to get value 72 (integer). Please, no javascript. Just html and php.
Thanks
You have to use javascript for what you are trying to do. If you want the button to change on the fly without submitting the form, you have to do client-side scripting (javascript).
Either:
Change the value of button after the dropdown is selected and form is submitted
Use two lines of javascript to change the value of the button when the select box is changed
In all.php:
if (isset($_POST['period_dropdown'])) {
$period1 = $_POST['period_dropdown'];
//do something with $period1
}
?>
<form name="period" action="all.php" method="POST">
<div align="center">
<select id="period_dropdown" name="period_dropdown" onchange="updateButton()">
<option value="nill"></option>
<option value="48">48</option>
<option value="72">72</option>
<option value="96">96</option>
<option value="120">120</option>
</select>
<input id="period_button" type="submit" value= "OK" >
</div></form>
<script type="text/javascript">
function updateButton() {
document.getElementById("period_button").value = document.getElementById("period_dropdown").value;
}
</script>