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>
Related
What I'm attempting to do with the below code is call a PHP function from an drop-down menu.
Is there a clean way of doing this?
code:
<html>
<head>
</head>
<body>
<?php
function OnSelectionChange() {
echo("OK IT WORKS");
}
?>
<section>
<select onchange="OnSelectionChange()">
<option value='' disabled selected>Assign Driver</option>
<option value='4353'>Steve Jobs</option>
<option value='3333'>Ian Wright</option>
<option value='66666'>Mark James</option>
</select>
</section>
</body>
</html>
You can get the selected value from the drop down list simply using php without using JavaScript.
<html>
<head>
<title>Country</title>
</head>
<body>
<form method="POST" action="">
Select Your Country
<select name="country" onchange="this.form.submit()">
<option value="" disabled selected>--select--</option>
<option value="india">India</option>
<option value="us">Us</option>
<option value="europe">Europe</option>
</select>
</form>
<?php
if(isset($_POST["country"])){
$country=$_POST["country"];
echo "select country is => ".$country;
}
?>
</body>
</html>
simple ajax using jquery
index page
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#myDropDown').change(function(){
//Selected value
var inputValue = $(this).val();
alert("value in js "+inputValue);
//Ajax for calling php function
$.post('submit.php', { dropdownValue: inputValue }, function(data){
alert('ajax completed. Response: '+data);
//do after submission operation in DOM
});
});
});
</script>
</head>
<body>
<select id="myDropDown">
<option value='' disabled selected>Assign Driver</option>
<option value='4353'>Steve Jobs</option>
<option value='3333'>Ian Wright</option>
<option value='66666'>Mark James</option>
</select>
</body>
</html>
in submit.php
<?php
function processDrpdown($selectedVal) {
echo "Selected value in php ".$selectedVal;
}
if ($_POST['dropdownValue']){
//call the function or execute the code
processDrpdown($_POST['dropdownValue']);
}
for simple js ajax use XMLHttpRequest
Does not connect onchange event with php function.
must use javascript function
<script>
function OnSelectionChange()
{
alert("OK IT WORKS");
}
</script>
<html>
<head>
<title>Country</title>
</head>
<body>
<form>
Select Your Country
<select name="country" onchange="this.form.submit()">
<option value="" disabled selected>--select--</option>
<option value="india">India</option>
<option value="us">Us</option>
<option value="europe">Europe</option>
</select>
</form>
<?php
if(isset($_GET["country"])){
$country=$_GET["country"];
echo "select country is => ".$country;
}
?>
</body>
</html>
Can't do that, use JavaScript function instead
<html>
<head>
</head>
<body>
<script>
function OnSelectionChange()
{
alert("OK IT WORKS");
}
</script>
<section>
<select onchange="OnSelectionChange()">
<option value='' disabled selected>Assign Driver</option>
<option value='4353'>Steve Jobs</option>
<option value='3333'>Ian Wright</option>
<option value='66666'>Mark James</option>
</select>
</section>
</body>
</html>
This mild adaptation has worked well for me. So very many thanks to vivekcs0114 and furthermore nicely avoids JS and the required Ajax solution which after around 200 miserable attempts has been a total disaster.
<form method="post" action="">
<select method="post" name="areasel" onchange="this.form.submit()">
<option value="Choose one">Choose one</option>
<option value="Complete Airframe">Complete Airframe</option>
<option value="Armstrong Siddeley">Armstrong Siddeley</option>
<option value="Something">Something</option>
</select>
</form>
<?php
if(isset($_POST["areasel"]))
{
$type=$_POST["areasel"];
echo "<BR>Do some SQL stuff using :".$type;
}
?>
I'm trying to do something very simple in PHP, but keep getting an error message. Essentially, when someone selects "Cat", I want "Miaow" to appear.
My idea was:
<select name="demo">
<option value="Dog">Dog</option>
<option value="Cat">Cat</option>
<option value="Fish">Fish</option>
</select>
<?php if ($_POST['demo'] == 'Cat') { echo 'Miaow'; } ?>
However, in PHPFiddle,
I get 'E_NOTICE : type 8 -- Undefined index...'
as soon as the code runs. Am I missing something basic? Thanks!
Your form might be passing data by $_GET instead of $_POST.
Did you specify the method ?
<form method="post" action="index.php">
<select name="demo">
<option value="Dog">Dog</option>
<option value="Cat">Cat</option>
<option value="Fish">Fish</option>
</select>
<input type="submit" value="Submit">
</form>
You can var_dump($_POST); and var_dump($_GET); to see what those variables contains in your PHP file.
Or you can do it in javascript like this :
function animal(value) {
if(value == "Cat") {
document.getElementById("myAnimal").innerHTML = "Miaouw";
} else {
document.getElementById("myAnimal").innerHTML = "Rooooah";
}
}
<form action="#">
<select name="demo" onchange="animal(this.value)">
<option value="Dog">Dog</option>
<option value="Cat">Cat</option>
<option value="Fish">Fish</option>
</select>
</form>
<span id="myAnimal"></span>
Is it even possible to do this using PHP so that "Miaow" comes up automatically on select, rather than having to submit the form?
You are looking for JavaScript code, not PHP. Here is a jQuery example:
$(document).on('change', '.animals', function(){
$('.noise-target').html( $('option:selected', this).data('noise') );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="animals">
<option>Select</option>
<option data-noise="Woof">Dog</option>
<option data-noise="Meow">Cat</option>
</select>
<div class="noise-target"></div>
Maybe this will help, I write some block as far as I understand...
<form action="#" method="post">
<select name="demo">
<option value="Dog">Dog</option>
<option value="Cat">Cat</option>
<option value="Fish">Fish</option>
</select>
<input type="submit" name="sub" />
</form>
<?php
if(isset($_POST['sub'])){
if($_POST['demo'] == "cat"){
echo "Miao";
}
}
?>
<select name='car1'>
<option value='1'>Toyota</option>
<option value='2'>Honda</option>
<option value='3'>Ford</option>
</select>
<input type='submit' name='submitform' />
if(isset($_POST['submitform'])){
$Getvalue = $_POST['car1'];
echo $Getvalue;
}
How do I get the values (Toyota, Honda, and Ford) not the numbers
In POST you receive only submitted value, so you should use
<option value="Toyota">Toyota</option>
Use it.
<select name='car1'>
<option value='Toyota'>Toyota</option>
<option value='Honda'>Honda</option>
<option value='Ford'>Ford</option>
</select>
Alternatively, if you could, you could use jquery in this one. You need another container for that 'Name'. Consider this example:
<?php
if(isset($_POST['car1'])) {
$id = $_POST['car1'];
$name = $_POST['selected'];
echo $name;
}
?>
<form method="POST" action="">
<input type="hidden" name="selected" value="" />
<select name='car1'>
<option value='1'>Toyota</option>
<option value='2'>Honda</option>
<option value='3'>Ford</option>
</select>
</form>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('select[name="car1"]').change(function(){
// as you select your pick,
// this will append the name inside the hidden input
var selected = $(this).val();
var value = $('select[name="car1"] option[value="'+selected+'"]').text();
$(this).prev('input[name="selected"]').attr('value', value);
$('form').submit();
});
});
</script>
Sample Fiddle
Only option values will be send in $_POST. If you don't need values in numbers, replace them with text values.
<select name='car1'>
<option value='Toyota'>Toyota</option>
<option value='Honda'>Honda</option>
<option value='Ford'>Ford</option>
</select>
Web-browser send to web-server post line like "car1=1&submitform=". Php script does not known about what inside options. Change values to:
<select name='car1'>
<option value='Toyota'>Toyota</option>
<option value='Honda'>Honda</option>
<option value='Ford'>Ford</option>
</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
I want to display a number of textboxes in a form based on the selected option from a dropdown listbox.
For example, if user selects 1 then 1 textbox should be shown and if user selects 2 then 2 textboxes should be displayed. And I need to do it in PHP.
I found some answers using jQuery. Can we use jQuery inside PHP? If yes, then how?
Edit
#Edwin Alex
This is how my select option looks like.
<h2><u>DEPENDENT DETAILS</u></h2><br />
<table border="1" style="border-style:dotted" width="100%" id="dependenttable">
<tr><td>No of Dependent</td><td><select name="numDep" id="dropdown">
<option value="">Please Select</option>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option></select></td></tr>
<tr id="textboxDiv"></tr>
At the end of file inside <> these I have written your code.
You can use Jquery to get this. Try this,
HTML :
<tr><td>No of Dependent</td><td><select name="numDep" id="dropdown">
<option value="">Please Select</option>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option></select></td>
</tr>
<tr id="textboxDiv"></tr>
Jquery :
<script type="text/javascript">
$(document).ready(function() {
$("#dropdown").change(function() {
var selVal = $(this).val();
$("#textboxDiv").html('');
if(selVal > 0) {
for(var i = 1; i<= selVal; i++) {
$("#textboxDiv").append('<input type="text" name="textVal[]" value="" />');
}
}
});
});
</script>
Paste this code at the bottom of your page inside tag.
Your select box ID should be dropdown.
You need to have a div with an ID textboxDiv to place your generated textboxes.
I think you can do it easily with the help of JavaScript. Here is an example of it. Try it and modify it according to your requirement
<html>
<head>
<title>Select DIV to show</title>
<script type="text/javascript">
function show(obj) {
no = obj.options[obj.selectedIndex].value;
count = obj.options.length;
for(i=1;i<count;i++)
document.getElementById('myDiv'+i).style.display = 'none';
if(no>0)
document.getElementById('myDiv'+no).style.display = 'block';
}
</script>
</head>
<body>
<form name="myForm">
<select onChange="show(this)">
<option value="0">Select</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
</form>
<div id="myDiv1" style="display:none"> <form>
<select>
<option value="0">Select</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
</form></div>
<div id="myDiv2" style="display:none"><form><input type="text" ><br>
<input type="text"/><br>
<input type="submit"/></form></div>
<div id="myDiv3" style="display:none"><form><input type="text" ><br>
<input type="text"/><br>
<input type="submit"/></form></div>
</body>
</html>
In this example just change the code in "myDiv1", "myDiv2", "myDiv3". I think it will hep you.:)