@extends('template.index')
@section('title', 'Data Statistik SI PeSSUT KOTA SAMARINDA')
@section('datastatistik', 'active')
@section('konten')

    <section class="blog-area pt-120 pb-120">
        <div class="container">
            <div class="row">
                
                <div class="col-lg-12 col-md-7">
                    <div class="post-comment-form">
                        <div class="widget-title">
                            <h5>Data LPPD</h5>
                        </div>
                        {!! Form::open(
                            ['route' => ['datastatistik.data'], 
                             'role'  => 'form',
                             'method'=> 'post']) !!}
                        <div class="row">
                                <div class="col-lg-3">
                                        <select class="form-control" name="bidangUrusan" id="bidang">
                                            <option disable>Bidang Urusan</option>
                                            @foreach ($bidangs as $bidang)
                                                <option value="{{ $bidang->id }}" data-pid="{{ $bidang->id }}">{{ $bidang->nama_bidang }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-lg-2">
                                        <select class="form-control" name="sumberData" id="sumberData">
                                            <option disable>OPD</option>
                                        </select>
                                    </div>
                                    <div class="col-lg-3">
                                            <select class="form-control" name="sumberOpd" id="sumberOpd">
                                                <option disable>Elemen Data</option>
                                            </select>
                                        </div>
                                    <div class="col-lg-4">
                                            <button type="submit" class="btn btn-default">Pilih</button>    
                                    </div>
                                </div>
                                {!! Form::close() !!} 
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
@push('style')
<script type="text/javascript">
    $(document).on('change','#bidang', function(e){
		var id = $(this).children(":selected").attr("data-pid");
		
		$.ajax({
			type	 : 'get',
			url		 : "{{ url('datastatistik/bidang-urusan') }}",
			data	 : {id:id},
			typeData : 'json',
			success:function(data)
			{
				console.log(data)
				$('.listData').remove();
				var tablaDatos = $('#sumberData');
				
					$(data).each(function(key,value){
					    tablaDatos.append("<option class='listData' data-pid='"+value.id+"' value='"+value.id+"'>"+value.nama_opd+"</option>");
					});
				
			}
		})
	})
	
</script>

<script type="text/javascript">
    $(document).on('change','#sumberData', function(e){
		var id = $(this).children(":selected").attr("data-pid");
		
		$.ajax({
			type	 : 'get',
			url		 : "{{ url('datastatistik/bidang-urusan-data-opd') }}",
			data	 : {id:id},
			typeData : 'json',
			success:function(data)
			{
				console.log(data)
				$('.listDataOpd').remove();
				var tablaDatos = $('#sumberOpd');
				
					$(data).each(function(key,value){
					    tablaDatos.append("<option class='listDataOpd' value='"+value.id+"'>"+value.nama_data+"</option>");
					});
				
			}
		})
	})
	
</script>
@endpush

@endsection