Я пытаюсь сделать зависимое выпадающее меню в laravel и ajax. У меня есть две таблицы, район и танас. Районы могут иметь много танасов. Я пытаюсь что-то сделать, когда выбираю район, покажет только танас под этим районом.
$data=Thana::select('name','id')->where('district_id',$request->id)->take(100)->get();
return response()->json($data);//
Предполагается, что он возвращает имя и идентификатор thana, которые соответствуют запрошенному идентификатору района, но по какой-то причине это не удается. Тем не менее отображается правильный district_id.
Это код моего контроллера.
use Illuminate\Http\Request;
use App\District;
use App\Thana;
use App\Atm;
class AtmController extends Controller
{
public function atmfunct(){
$atmdistrict=District::all();
$atmthana=Thana::all();//get data from table
return view('MasterForms.atmlist',compact('atmthana','atmdistrict'));//sent data to view
}
public function findThanaName(Request $request){
//if our chosen id and products table prod_cat_id col match the get first 100 data
//$request->id here is the id of our chosen option id
$data=Thana::select('name','id')->where('district_id',$request->id)->take(100)->get();
return response()->json($data);//then sent this data to ajax success
}
}
Это та часть, где я подключаю запрос jquery.
<span>District: </span>
<select style="width: 200px" class="districtt" id="district_id">
<option value="0" disabled="true" selected="true">-Select-</option>
@foreach($atmdistrict as $cat)
<option value="{{$cat->id}}">{{$cat->name}}</option>
@endforeach
</select>
<span>Thana Name: </span>
<select style="width: 200px" class="name">
<option value="0" disabled="true" selected="true">Thana Name</option>
@foreach($atmthana as $cat)
<option value="{{$cat->id}}">{{$cat->name}}</option>
@endforeach
</select>
</center>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(document).on('change','.districtt',function(){
console.log("hmm its change");
var district_id=$(this).val();
console.log(district_id);
var div=$(this).parent();
var op=" ";
$.ajax({
type:'get',
url:'{!!URL::to('findThanaName')!!}',
data:{'id':district_id},
success:function(data){
console.log('success');
//console.log(data);
//console.log(data.length);
op+='<option value="0" selected disabled>chose division</option>';
for(var i=0;i<data.length;i++){
op+='<option value="'+data[i].id+'">'+data[i].name+'</option>';
}
div.find('.name').html(" ");
div.find('.name').append(op);
},
error:function(){
console.log('error');
}
});
});
});
</script>
Я не могу понять, где я иду не так.