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

<section id="home" class="slider-area bg-shape" style="background-image:url({{asset('asset/img/shape/002.png')}}) ">
    <div class="slider-active" id="bg">
        <div class="single-slider">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-xl-7 col-lg-7">
                        <div class="slider-img pt-150 sembunyi" data-animation="fadeInDown" data-delay=".8s">
                            <img class="img-fluid" src="{{asset('asset/img/icon/dalam-angka2.png')}}" alt="" style="width: 400px; webkit-filter: drop-shadow(8px 8px 10px rgba(0,0,0,0.5));
                            filter: drop-shadow(8px 8px 10px rgba(0,0,0,0.5)); padding-bottom: 20px;">
                        </div>
                    </div>
                    <div class="col-xl-5 col-lg-5">
                        <div class="container" data-animation="fadeInRight">
                            <!-- custom radio button -->

                            <!-- custom select -->
                            <div class="holder">
                                <div class="widget-title">
                                    <h5>Samarinda Dalam Angka</h5>
                                </div>
                                {!! Form::open(
                                    ['route' => ['dalam-angka.data'], 
                                     'role'  => 'form',
                                     'class' => 'customSelect',
                                     'method'=> 'post']) !!}
                                    <div class="row">
                                        <div class="select">
                                            <select name="bidangOpd" id="opd">
                                                <option disable>Bidang OPD</option>
                                                @foreach ($lamangs as $lamang)
                                                    <option value="{{ $lamang->id }}" data-pid="{{ $lamang->opd_id }}">{{ $lamang->opd->nama_opd }}</option>
                                                @endforeach
                                            </select>
                                        </div>

                                        <div class="select">
                                            <select name="lamang_id" id="dataLamang" required>
                                                <option class="dummy" data-pid="0">Data Dalam Angka</option>
                                            </select>
                                        </div>

                                        <button type="submit" id="button" class="btn btn-default" disabled>Pilih</button>
                                    </div>
                                {!! Form::close() !!} 
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="container-fluid">
        <div class="row">
            <footer class="second-footer">
                <div class="copyright-text text-center">
                    <p>&copy; 2017 Dinas Komunikasi dan Informatika Pemerintah Kota Samarinda.</p>
                </div>
            </footer>
        </div>
    </div>
</section>

@push('style')
<script type="text/javascript">
    var opd = $('#opd');
    $(document).on('change','#opd', function(e){
		var id = $(this).children(":selected").attr("data-pid");
		jQuery('#button').attr('disabled', 'disabled');
		
		$.ajax({
			type	 : 'get',
			url		 : "{{ url('dalam-angka/bidang-opd') }}",
			data	 : {id:id},
			typeData : 'json',
			success:function(data)
			{
				console.log(data)
				$('.listData').remove();
				var tablaDatos = $('#dataLamang');
				
				$(data).each(function(key,value){
				   tablaDatos.append("<option class='listData' data-pid='"+value.id+"' value='"+value.id+"'>"+value.frekuensi+" - "+value.nama_kegiatan+"</option>");
				});
				
			}
		})
		
		$(document).on('change','#dataLamang', function(e){
            var kegiatan = $(this).children(":selected").attr("data-pid");
		    if(kegiatan != 0 || kegiatan != '') {
				jQuery('#button').removeAttr('disabled');
			}
		})
	})
	
</script>
@endpush

@endsection