I have 3 select option for searching the records in datatable with ajax jQuery php.
I have write this code but select option data is not going to other page & not returning back from ajax request.
PHP Code:-
<form name="search_form" id="search_form" method="POST">
<div class="col-md-3">
<div class="formrow">
<select class="form-control" name="job_title" class="select_filter">
<option value ='' disabled selected>Job Title</option>
<option>PHP Developer</option>
<option>Andorid Developer</option>
</select>
</div>
</div>
<div class="col-md-3">
<div class="formrow">
<select class="form-control" name="emptype" class="select_filter">
<option value ='' disabled selected>Employment Status</option>
<option>Permanent</option>
<option>Contract</option>
<option>Freelance</option>
</select>
</div>
</div>
<div class="col-md-3">
<div class="formrow">
<select class="form-control" name="experience" class="select_filter">
<option value ='' disabled selected>Experience</option>
<option>Fresher</option>
<option>1 Year</option>
<option>2 Years</option>
<option>3 Years</option>
<option>4 Years</option>
<option>5 Years</option>
<option>6 Years</option>
<option>7 Years</option>
<option>8 Years</option>
<option>9 Years</option>
<option>10 Years</option>
</select>
</div>
</div>
</form>
jQuery / Ajax Code:-
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript" rel="stylesheet">
$(document).ready(function(){
$('.select_filter').on('change',function(){
$.ajax({
type: "POST",
url: "ajaxCompany_search.php",
data: $('#search_form').serialize(),
success:function(data){
console.log(data);
alert(data);
$("#projects").html(data);
}
});
});
});
</script>
ajaxCompany_search.php
<?php
include('../../config.php');
print_r($_POST);
?>
2
Answers
you have to group the class in an uniq tag:
change
to
You have given class two times inside the select field, due to which data is not showing.
write code as
It is written like this right there