@extends('common.dashboard')

@section('title','Create hospital category')
@section('content')
	<div class="row">
	    <div class="col-12">
	        <div class="page-title-box d-flex align-items-center justify-content-between">
	            <h4 class="mb-0 font-size-18">Create Hospital category</h4>

	            <div class="page-title-right">
	                <ol class="breadcrumb m-0">
	                    <li class="breadcrumb-item"><a href="javascript: void(0);">Home</a></li>
	                    <li class="breadcrumb-item active"><a href="/common/hospital-categories"> Hospital category</a></li>
	                </ol>
	            </div>
	            
	        </div>
	    </div>
	</div>    
	<form method="post" class="row " enctype="multipart/form-data" id="save"> @csrf
		<div class="col-md-3"></div>	
		<div class="col-md-6 shadow-lg">
			@include('admin.hospital.category.form')
			<div class="col-md-12 mb-5">
				<button type="submit" class="float-right btn btn-dark waves-effect waves-light">Save Category</button>
			</div><br><br>
		</div>	
		<div class="col-md-3"></div>	
	</form><br><br><br>
	<!-- </div> -->
<style type="text/css">
	label {font-weight: normal; color: #8e8e8e;}
	.multi_option{padding:4px 0px;border-bottom:1px solid silver;}
</style>

<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script type="text/javascript">
$(function(){
	var url = $('#base_url').val();
    //get district to sub-districts
    $('.district').change(function(){
        if ($(this).val().length >0) {
          	$.ajax({
	            type:'get', url: '/common/dis-id-sub_districts',
	            data: {id: $(this).val()},
	            success: function (response) { $('.district_result').html(response);},
	            error: function () {
	                $('.district_result').html('<option value="">No data found</option>');
	            },
	        });
        }
    });

    //checkbox for hospital selection
   	$('#is_hospital').click(function(){
        if($(this).prop("checked") == true){
            $('.hospitals').prop('disabled',false);
            $('.hospitals').prop('required',true);
            $(this).val(1);
        }
        else if($(this).prop("checked") == false){
           $('.hospitals').prop('disabled',true);
           $('.hospitals').prop('required',false);
           $('.select2-selection__rendered').text(''); $(this).val(0);
        }
    });
    //loading on click
    $('#save').on('submit',function(){
    	$(this).prop('disabled',true);
    	$('[type=submit]').html('Working ...');
    })
})
</script>
@endsection