I have two dropdown list, I want to know what user has selected in these dropdowns, based on that I need fetch data from DB using PHP. Please note that There is no submit button. I don't know how send javascript var value to PHP code.
Here it is what I've done so far
<head>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script>
$(document).ready(function(){
$('select.day').on('change',function(){
var select = $(this).val();
alert(select);
});
$.ajax({
Type : "POST",
url : "new.php",
data : {name : select},
success : function(msg)
{
$('#d').text(msg);
alert(msg);
}
});
});
</script>
</head>
<body>
<p id="d"></p>
<Select class="day" onchange="getTimeFrame(this.value)">
<Option >Today</Option>
<Option>This Week</Option>
<Option>Last Week</Option>
</Select>
<Select class="filter" onchange="getFilterType(this.value)">
<Option >User</Option>
<Option>Client</Option>
<Option>Project</Option>
</Select>
</body>
</html>
Here it is PHP file
<?php
// $time = $_POST['select'];
$filter = $_POST['name'];
//echo "Hello from new";
echo $filter;
?>
But nothing seems working for me. Anybody know how to achieve this?
Add your Ajax
code inside the onchange
event of the select .
Updated
typo change type
instead Type
,is not caps .All are small letter.Javascript is case sensitive
$('select.day').on('change', function() {
var select = $(this).val();
$.ajax({
type: "POST",
url: "new.php",
data: {
name: select
},
success: function(msg) {
$('#d').text(msg);
alert(msg);
}
});
})
Change Html as like this
<Select class="day">
<Option >Today</Option>
<Option>This Week</Option>
<Option>Last Week</Option>
</Select>
For send both drop down value try this
$('select.day').on('change', function() { var select = $('select.day').map(function(){ return $(this).val() }).get(); console.log(select) $.ajax({ type: "POST", url: "new.php", data: { name: select }, success: function(msg) { $('#d').text(msg); alert(msg); } }); })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <Select class="day" > <Option >Today</Option> <Option>This Week</Option> <Option>Last Week</Option> </Select> <Select class="day filter" > <Option >User</Option> <Option>Client</Option> <Option>Project</Option> </Select>
In your onchange Event you only get with select = $(this)... the value of the changed selectbox. You have to reference to the other one, too with Name = $(".filter")..... and then send it with ajax
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.