@extends('layouts.app')

@section('title','Join us to admitdoctors.com')
@section('content')
<div class="">
    <div class="container">
        <div class="row justify-content-md-center">
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                <div class="dc-registerformhold">
                    <div class="dc-registerformmain">
                        <div class="dc-registerhead">
                            <div class="dc-title">
                                <h3>Join us</h3>
                            </div>
                            <div class="dc-description">
                                <p>Join admitdoctors & invoke others for voluntery activities</p>
                            </div>
                        </div>
                        <div class="dc-joinforms">
                            <div class="dc-formtheme">
                                <fieldset class="dc-formregisterstart">
                                    <div class="row">
                                        <div class="col-md-12 p-4 bg-white">
                                            <div class="row">
                                                <div class="col-md-6">
                                                    <div class="form-check bg-light p-2">
                                                        <input class="form-check-input" type="radio" name="type" id="exampleRadios1" value="doctor">
                                                        <label class="form-check-label text-info" for="exampleRadios1">
                                                          Join us as a <b>Doctor</b>
                                                        </label>
                                                    </div>
                                                </div>
                                                <div class="col-md-6">
                                                    <div class="form-check bg-light p-2">
                                                        <input class="form-check-input" type="radio" name="type" id="exampleRadios2" value="hospital">
                                                        <label class="form-check-label text-info" for="exampleRadios2">
                                                            Join us as a <b>Hospital</b>
                                                        </label>
                                                    </div>
                                                </div>
                                            </div> <hr>
                                           
                                            <div class="row">
                                                <div class="col-md-6">
                                                    <div class="form-check bg-light p-2">
                                                        <input class="form-check-input" type="radio" name="type" id="exampleRadios3" value="blood">
                                                        <label class="form-check-label text-info" for="exampleRadios3">
                                                        Join us as a <b>Blood donor</b>
                                                        </label>
                                                    </div>
                                                </div>
                                                <div class="col-md-6">
                                                    <div class="form-check bg-light p-2">
                                                        <input class="form-check-input" type="radio" name="type" id="exampleRadios4" value="ambulance">
                                                        <label class="form-check-label text-info" for="exampleRadios4">
                                                            Join us as a <b>Ambulance Service provider</b>
                                                        </label>
                                                    </div> 
                                                </div> 
                                            </div>
                                            <hr>
                                            <div class="row">
                                                <div class="col-md-6">
                                                    <div class="form-check bg-light p-2">
                                                        <input class="form-check-input" type="radio" name="type" id="exampleRadios5" value="volunteer">
                                                        <label class="form-check-label text-info" for="exampleRadios5">
                                                        Join us as a <b>Volunteer</b>
                                                        </label>
                                                    </div>
                                                </div>
                                                
                                            </div>
                                        </div>
                                    </div>
                                </fieldset>
                            
                            </div>
                            <div class="row regForm"></div>
                        </div>
                    </div>
                    
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<style>
    .dc-contactvone {
        margin: 0 0 -100px;
    }
    .form-check-input{
        height:20px;width:20px;left:2%
    }
    .form-check-label{
        padding-left:5%
    }
</style>
    <script>
        $(function(){
            $('[name=type]').on('change', function(){
                var type = $(this).val();
                $.get('/get-register-form/'+type, function(data){
                    $('.regForm').html(data);
                })
            })
        })
    </script>
@endpush