I have Table called predictions with columns Currorg1,Currorg2,Currorg3,Currorg4,Currorg5 now I am getting all these values in multi select dropdown. I want to implement dynamic dropdown i.e. when I select Currorg1 then all the values in Currorg2 must load values dependent on Currorg1 selection.
For e.g. this is my table | Curr0rg1 | Currorg2 | | -------- | ---------| | First | row1 | | Second | row2 | | First | row3 | | First | row4 | | Second | row 5 |
Now when First is selected it should display row1,row3,row4 in Currorg2 dropdown and so on. I have followed this tutorial: https://www.webslesson.info/2018/03/ajax-dynamic-dependent-dropdown-in-laravel.html but not sure what I am doing wrong.
Here is my controller:
public function index(Request $request,ExportDataTable $dataTable)
{
if(request()->ajax())
{
if(!empty($request->BusinessUnit) || !empty($request->CurrOrg1) || !empty($request->CurrOrg2) || !empty($request->Role) || !empty($request->Region) || !empty($request->ProfessionalClassification) || !empty($request->Gender) || !empty($request->CurrOrg3) || !empty($request->CurrOrg4) || !empty($request->CurrOrg5) || !empty($request->L6) || !empty($request->L7) || !empty($request->Account))
{
$loged_user =Auth::user();
$user= DB:: table('users')
->selectRaw('users.*, REPLACE(Org2, "Admin", "") AS ROrg2, REPLACE(Org1, "Admin", "") AS ROrg1, REPLACE(Org3, "Admin" , "") AS ROrg3')
->where('email',$loged_user->email)
->first();
$query= DB:: table('predictions')
->where('CurrOrg1','like','%'.$user->ROrg1.'%')
->where('CurrOrg2','like','%'.$user->ROrg2.'%')
->where('CurrOrg3','like','%'.$user->ROrg3.'%')
->select('predictions.id','predictions.EmployeeNumber','predictions.Role','predictions.Region','predictions.CurrOrg1','predictions.CurrOrg2','predictions.RiskZone','predictions.Probablity','predictions.Rating','predictions.Feedback','predictions.Gender','predictions.CurrOrg3','predictions.CurrOrg4','predictions.CurrOrg5','predictions.ProfessionalClassification','predictions.Local_Expat','predictions.EmployeeRoleSeniority','predictions.FeedRisklevel','predictions.Feedinfluencers','predictions.Action','predictions.Fname','predictions.Lname','predictions.Avgweekhr','predictions.Account','predictions.L6','predictions.L7');
if(!empty($request->CurrOrg2)) {
$query->whereIn('CurrOrg2',$request->CurrOrg2);
}
if(!empty($request->Region)) {
$query->whereIn('Region',$request->Region);
}
if(!empty($request->ProfessionalClassification)) {
$query->whereIn('ProfessionalClassification',$request->ProfessionalClassification);
}
if(!empty($request->CurrOrg1)) {
$query->whereIn('CurrOrg1',$request->CurrOrg1);
}
if(!empty($request->CurrOrg3)) {
$query->whereIn('CurrOrg3',$request->CurrOrg3);
}
if(!empty($request->CurrOrg4)) {
$query->whereIn('CurrOrg4',$request->CurrOrg4);
}
if(!empty($request->CurrOrg5)) {
$query->whereIn('CurrOrg5',$request->CurrOrg5);
}
if(!empty($request->Role)) {
$query->whereIn('Role',$request->Role);
}
if(!empty($request->BusinessUnit)) {
$query->whereIn('BusinessUnit',$request->BusinessUnit);
}
if(!empty($request->Gender)) {
$query->whereIn('Gender',$request->Gender);
}
if(!empty($request->L6)) {
$query->whereIn('L6',$request->L6);
}
if(!empty($request->L7)) {
$query->whereIn('L7',$request->L7);
}
if(!empty($request->Account)) {
$query->whereIn('Account',$request->Account);
}
$data = $query->get();
}
else
{
$loged_user =Auth::user();
$user= DB:: table('users')
->selectRaw('users.*, REPLACE(Org2, "Admin", "") AS ROrg2, REPLACE(Org1, "Admin", "") AS ROrg1, REPLACE(Org3, "Admin" , "") AS ROrg3')
->where('email',$loged_user->email)
->first();
$data1 =DB:: table('predictions')
->where('CurrOrg1','like','%'.$user->ROrg1.'%')
->where('CurrOrg2','like','%'.$user->ROrg2.'%')
->where('CurrOrg3','like','%'.$user->ROrg3.'%')
->select('predictions.id','predictions.EmployeeNumber','predictions.Role','predictions.Region','predictions.CurrOrg1','predictions.CurrOrg2','predictions.RiskZone','predictions.Probablity','predictions.Rating','predictions.Feedback','predictions.Gender','predictions.CurrOrg3','predictions.CurrOrg4','predictions.CurrOrg5','predictions.ProfessionalClassification','predictions.Local_Expat','predictions.EmployeeRoleSeniority','predictions.FeedRisklevel','predictions.Feedinfluencers','predictions.Action','predictions.Fname','predictions.Lname','predictions.Avgweekhr','predictions.Account','predictions.L6','predictions.L7');
$data = $data1->get();
}
return datatables()->of($data)
->addColumn('Feedback', function($data)
{
if($data->Action == 'No' || is_null($data->Action))
{
return "<a href='#' style='background-color:#CA0088;color:#fff' class='btn btn-sm Feedback' id='".$data->id."'>Feedback</a>";
}
else
{
return "<a href='#' style='background-color:#00A300;color:#fff' class='btn btn-sm Feedback' id='".$data->id."'>Feedback</a>";
}
})
->escapeColumns([])
->make(true);
}
$Business_unit_name = DB::table('predictions')
->select('BusinessUnit')
->groupBy('BusinessUnit')
->orderBy('BusinessUnit', 'ASC')
->get();
$CurrOrg1_name = DB::table('predictions')
->select('CurrOrg1')
->groupBy('CurrOrg1')
->orderBy('CurrOrg1', 'ASC')
->get();
$CurrOrg2_name = DB::table('predictions')
->select('CurrOrg2')
->groupBy('CurrOrg2')
->orderBy('CurrOrg2', 'ASC')
->get();
$CurrOrg3_name = DB::table('predictions')
->select('CurrOrg3')
->groupBy('CurrOrg3')
->orderBy('CurrOrg3', 'ASC')
->get();
$CurrOrg4_name = DB::table('predictions')
->select('CurrOrg4')
->groupBy('CurrOrg4')
->orderBy('CurrOrg4', 'ASC')
->get();
$CurrOrg5_name = DB::table('predictions')
->select('CurrOrg5')
->groupBy('CurrOrg5')
->orderBy('CurrOrg5', 'ASC')
->get();
$Role_name = DB::table('predictions')
->select('Role')
->groupBy('Role')
->orderBy('Role', 'ASC')
->get();
$Region_name = DB::table('predictions')
->select('Region')
->groupBy('Region')
->orderBy('Region', 'ASC')
->get();
$Gender_name = DB::table('predictions')
->select('Gender')
->groupBy('Gender')
->orderBy('Gender', 'ASC')
->get();
$ProfessionalClassification_name = DB::table('predictions')
->select('ProfessionalClassification')
->groupBy('ProfessionalClassification')
->orderBy('ProfessionalClassification', 'ASC')
->get();
$Prediction= new Prediction;
$Prediction_list= $Prediction::all();
$Topcorrelators = DB::table('predictions')
->select('Topcorrelators')
->groupBy('Topcorrelators')
->orderBy('Topcorrelators', 'ASC')
->get();
$L6_name = DB::table('predictions')
->select('L6')
->groupBy('L6')
->orderBy('L6','ASC')
->get();
$L7_name = DB::table('predictions')
->select('L7')
->groupBy('L7')
->orderBy('L7','ASC')
->get();
$Account_name = DB::table('predictions')
->select('Account')
->groupBy('Account')
->orderBy('Account','ASC')
->get();
return view('admin.members.Predictions', compact('Business_unit_name','CurrOrg1_name','CurrOrg2_name','CurrOrg3_name','CurrOrg4_name','CurrOrg5_name','Role_name','Region_name','Gender_name','Topcorrelators','ProfessionalClassification_name','Prediction_list','L6_name','L7_name','Account_name'));
}
/**
* Show the form for creating a new resource.
*
* @return \Illuminate\Http\Response
*/
function fetch(Request $request)
{
$select = $request->get('select');
$value = $request->get('value');
$dependent = $request->get('dependent');
$data = DB::table('predictions')
->where($select, $value)
->groupBy($dependent)
->get();
$output = '<option value="">Select '.ucfirst($dependent).'</option>';
foreach($data as $row)
{
$output .= '<option value="'.$row->$dependent.'">'.$row->$dependent.'</option>';
}
echo $output;
}
This is my script:
$('.dynamic').change(function(){
if($(this).val() != '')
{
var select = $(this).attr("id");
var value = $(this).val();
var dependent = $(this).data('dependent');
var _token = $('input[name="_token"]').val();
$.ajax({
url:"{{ route('dynamic_dependent') }}",
method:"POST",
data:{select:select, value:value, _token:_token, dependent:dependent},
success:function(result)
{
$('#'+dependent).html(result);
}
})
}
});
$('#CurrOrg1').change(function(){
$('#CurrOrg2').val('');
$('#CurrOrg3').val('');
});
$('#CurrOrg2').change(function(){
$('#CurrOrg3').val('');
});
This is my view:
<div class="form-group" style="margin-right: 10px">
<select name="CurrOrg1[]" id="CurrOrg1" multiple class="form-control input-lg dynamic" data-dependent="CurrOrg2">
@foreach($CurrOrg1_name as $org1)
<option value="{{ $org1->CurrOrg1 }}">{{ $org1->CurrOrg1 }}</option>
@endforeach
</select>
</div>
<div class="form-group" style="margin-right: 10px">
<select name="CurrOrg2[]" id="CurrOrg2" multiple class="form-control input-lg dynamic" data-dependent="CurrOrg3">
<option value="">Select Org2</option>
</select>
</div>
<div class="form-group" style="margin-right: 10px">
<select name="CurrOrg3[]" id="CurrOrg3" multiple class="form-control">
<option value="">Select Org3</option>
</select>
</div>
{{ csrf_field() }}
Can someone suggest what I am doing wrong here?
