@extends('layouts.default')
@section('content')
<div class="right_col" role="main">
	<!-- Modal -->
	<div id="myModal" class="modal fade" role="dialog">
	  <div class="modal-dialog">

	    <!-- Modal content-->
	    <div class="modal-content">
	      <div class="modal-header">
	        <button type="button" class="close" data-dismiss="modal">&times;</button>
	        <h4 class="modal-title">New Referal</h4>
	      </div>
	      <div class="modal-body">
	        <form id="add_refere" method="post" enctype="multipart/form-data">
	        	{{ csrf_field() }}
	        	<div class="row">
	        	    <div class="col-md-4 col-sm-4 col-xs-12 mui-textfield mui-textfield--float-label form-group">
	        	        <input type="text" id="name" name="name" required="required">
	        	        <div class="help-block with-errors"></div>
	        	        <label>Name<i class="mandatory">*</i></label>
	        	    </div>
	        	    <div class="col-md-4 col-sm-4 col-xs-12 mui-textfield mui-textfield--float-label form-group">
	        	        <input type="text" id="email" name="email" required="required">
	        	        <div class="help-block with-errors"></div>
	        	        <label>Email<i class="mandatory">*</i></label>
	        	    </div>
	        	    <div class="col-md-4 col-sm-4 col-xs-12 mui-textfield mui-textfield--float-label form-group">
	        	        <input type="text" id="phone" name="phone" required="required">
	        	        <div class="help-block with-errors"></div>
	        	        <label>Phone<i class="mandatory">*</i></label>
	        	    </div>
	        	</div>
	        	<div class="row">
	        	    <div class="col-md-4 col-sm-4 col-xs-12 mui-textfield mui-textfield--float-label form-group">
                        <input type="text" id="date_of_birth" name="date_of_birth">
                        <div class="help-block with-errors"></div>
                        <label>D.O.B</label>
                     </div>
	        	    <div class="col-md-4 col-sm-4 col-xs-12 mui-select form-group">
	        	        {{ Form::select('visa_status', [''=>'Select Visa Status'], null, [ 'class'=>'form-control']) }}
	        	    </div>
	        	</div>
	        	{{ Form::submit('Add', ['class'=>'btn btn-sm btn-success', 'id'=>'add_btn']) }}
	        </form>
	      </div>
	      <div class="modal-footer">
	        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
	      </div>
	    </div>

	  </div>
	</div>
	<!-- Ends Here -->

	<div id="myeditModal" class="modal fade" role="dialog"></div>

    <div class="page-title">
      	<div class="title_left">
       	 	<h3>Refered Student List</h3>
     	</div>
      	<div class="title_right">
       	 	<button class="btn btn-sm btn-info pull-right" onclick="open_modal()"><i class="fa fa-plus"></i> Add</button>
     	</div>
    </div>

 	<div class="row"> 		
        <div class="col-md-12 col-sm-12 col-xs-12">
            <div class="x_panel">
            	<div class="x_content">
            		<div class="table-responsive text-center">
            			<i class="fa fa-spinner fa-spin fa-5x"></i>
            			<div id="refer_data_div"></div>
            		</div>
            	</div>
            </div>
        </div>
    </div>
</div>

<script>
	$(document).ready(function(){
		get_data();
	});

		$('#date_of_birth').datepicker({
		   format: 'dd-mm-yyyy',
		   todayHighlight: true,
		   clearBtn: true,
		   endDate: today,
		});

	function get_data(){
		$.ajax({
			url: "/referal_students_list",
			data: "", 
			success: function(result){
				$(".fa-spinner").fadeOut(1000);
				$("#refer_data_div").html(result);
			}
		});
	}
</script>

<script>
	function edit_refer(id){
		$.ajax({
			url: "/edit_refer/"+id,
			data: "", 
			success: function(result){
				$(".fa-spinner").fadeOut(1000);
				$("#myeditModal").html(result);
				$("#myeditModal").modal('show');
			}
		});
	}
</script>

<script>
	function open_modal(){
		$("#myModal").modal('show');
	}

	$("form#add_refere").submit(function(e) {
	    e.preventDefault();

	    var formData = new FormData(this);    

	    $.ajax({
            url: 'save_refer_student',
            type: 'POST',
            data: formData,
            success: function (data) {
                get_data();
                $("#myModal").modal('hide');
                $("form#add_refere").reset();
            },
            cache: false,
            contentType: false,
            processData: false
        });
	});
	
</script>
@endsection