@extends('layouts.main')
@section('title',"Update Candidate Education Details")
@section('content')
<style>
 .modal-skill-set  .select2-container--open .select2-dropdown--below {
    position: fixed !important;
    left: auto !important;
}

 .modal-skill-set  .select2-container--open .select2-dropdown--above {
    position: fixed !important;
    left: auto !important;
}
</style>
<div class="modal fade modal-skill-set" id="apply-job"  role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
				<div class="row md-content">
					<a href="{{ secure_url('candidate-dashboard') }}" type="button" class="btn btn-primary btn-icon-custom waves-effect md-close login-close-btn" id="modal_close"><span class="hiremee-multiply f-18"></span></a>
					<div class="col-md-12 p-t-15">
						<div class="b-l-g">
							<h5 class="f-w-100 f-16 g-l-b"><strong>Last Step -</strong> Tell us about your Skills & Qualification</h5>
							<div class="media p-t-15 p-b-15">
								<i class="text-info f-22 hiremee-info"></i>
								<div class="media-body p-l-10">
									<h5 class="f-14 text-info f-w-300">This has some basic profile information. Please fill out the necessary information below.</h5>
								</div>
							</div>
						</div>
							{!! Form::open(['url'=>'candidate/education-update','method'=>'POST','name'=>'educational-form','id'=>'js-educational-form']) !!}
					
							<div class="row">
								<div class="col-sm-6   col-md-6 col-xl-6">
								<div class="row">
								<div class="col-md-12">
									<label class="profile-label">Education :</label>
									</div>
									</div>
									<div class="row">
								<div class="col-md-12">
									{!! Form::select('course_type',[""=>"Select Education "]+$course_types ,null,['class'=>'form-control js-select2','id'=>'js-coursetype']) !!}
									<span id="js-coursetype-error"></span>
									</div>
									</div>
								</div>
								<div class="col-sm-6  col-md-6 col-xl-6">
								<div class="row">
								<div class="col-md-12">
									<label class="profile-label">Degree :</label>
									</div>
									</div>
									<div class="row">
								<div class="col-md-12">
									{!! Form::select('degree',[""=>"Any Degree"],null,['class'=>'form-control js-select2','id'=>'js-degree']) !!}
									<span id="js-degree-error"></span>
									</div>
									</div>
								</div>
							</div>
							<div class="row">
								
								<div class="col-sm-6   col-md-6 col-xl-6">
								<div class="row">
								<div class="col-md-12">
									<label class="profile-label">Specialization :</label>
									</div>
									</div>
									<div class="row">
								<div class="col-md-12">
										{!! Form::select('specialization',[""=>"Any Specialization"],null,['class'=>'form-control js-select2','id'=>'js-specialization']) !!}
									<span id="js-degree-error"></span>
									</div>
									</div>
								</div>
								<div class="col-sm-6   col-md-6 col-xl-6">
								<div class="row">
								<div class="col-md-12">
									<label class="profile-label">Year of Completion:</label>
									</div>
									</div>
									<div class="row">
								<div class="col-md-12">
										{!! Form::select('yearofcompletion',[""=>"Year of Completion"]+$yearofcompletion,null,['class'=>'form-control js-select2','id'=>'js-yearofcompletion']) !!}
									<span id="js-yearofcompletion-error"></span>
								</div>
								</div>
								</div>
							</div>
							<div class="row">
								
								<div class="col-sm-6   col-md-6 col-xl-6">
								<div class="row">
								<div class="col-md-12">
									<label class="profile-label">University:</label>
									</div>
									</div>
									<div class="row">
								<div class="col-md-12">
										{!! Form::select('university',[""=>"Any University"]+$university,null,['class'=>'form-control js-select2','id'=>'js-university-skill']) !!}
									<span id="js-university-skill-error"></span>
									</div>
									</div>
								</div>
								<div class="col-sm-6  col-md-6 col-xl-6">
								<div class="row">
								<div class="col-md-12">
									<label class="profile-label">College:</label>
									</div>
									</div>
									<div class="row">
								<div class="col-md-12">
										{!! Form::select('college',[""=>"College"],null,['class'=>'form-control js-select2','id'=>'js-college-skill']) !!}
									<span id="js-college-error"></span>
								</div>
								</div>
								</div>
							</div>
							<div class="row">								
								<div class="d-none col-sm-6 col-md-6 col-xl-6" id="others_details">
								<div class="row">
								<div class="col-md-12">
									<label class="profile-label">Others University:</label>
									</div>
									</div>
									<div class="row">
								<div class="col-md-12">
								{!! Form::text('others_university',null,['class'=>'form-control','id'=>'js-others_university']) !!}
									<span id="js-others_university-error"></span>
									</div>
									</div>
								</div>
								
								<div class="d-none col-sm-6  col-md-6 col-xl-6" id="others_details_college">
									<div class="row">
									<div class="col-md-12">
										<label class="profile-label">Others College:</label>
										</div>
										</div>
										<div class="row">
									<div class="col-md-12">
									{!! Form::text('others_college',null,['class'=>'form-control','id'=>'js-others_college']) !!}
										<span id="js-others_college-error"></span>
									</div>
									</div>
								</div>
							</div>

							<div class="row">								
								<div class="col-sm-6   col-md-6 col-xl-6">
								<div class="row">
								<div class="col-md-12">
									<label class="profile-label">Gender:</label>
									</div>
									</div>
									<div class="row">
								<div class="col-md-12">
										 {!! Form::select('gender',[""=>"Select Gender"]+$gender,null,['class'=>'form-control js-select2','id'=>'js-gender']) !!}
									<span id="js-gender-error"></span>
									</div>
									</div>
								</div>
								<div class="col-sm-6  col-md-6 col-xl-6">
								<div class="row">
								<div class="col-md-12">
									<label class="profile-label">Date of Birth:</label>
									</div>
									</div>
									<div class="row">
								<div class="col-md-12">
									<div class="input-group">
										{!! Form::text('date_of_birth',null,['class'=>'form-control js-date-dob','id'=>'js-date_of_birth','placeholder'=>'Enter Date of Birth'])  !!}
										<span class="input-group-addon" id="basic-addon5"><i class=" hiremee-calendar"></i></span>
										<span id="js-date_of_birth-error"></span>										
									</div> 
								</div>
								</div>
								</div>
						</div>
						<div class="row">	
						<div class="col-sm-6   col-md-6 col-xl-6">
								<div class="row">
								<div class="col-md-12">
									<label class="profile-label" style="padding: 0px;">Register number:</label>
									</div>
									</div>
									<div class="row">
								 <div class="col-md-12">
										{!! Form::text('reges_no',null,['class'=>'form-control','id'=>'reges_no','placeholder'=>'Register number','maxlength'=>'15']) !!}
							  			<span id="reges_no-error"></span>
									</div> 

									</div>
								</div>								
								<div class="col-sm-6   col-md-6 col-xl-6">
								<div class="row">
								<div class="col-md-12">
									<label class="profile-label" style="padding: 0px;">Place of Birth:</label>
									</div>
									</div>
									<div class="row">
								<div class="col-md-12">
										{!! Form::text('place_of_birth',null,['class'=>'form-control','id'=>'place_of_birth','placeholder'=>'Enter Place of birth']) !!}
							  			<span id="place_of_birth-error"></span>
									</div>
									</div>
								</div>								
						</div>	
						

						<div class="row p-t-20">
							<div class="col-md-12">
								<h4 class="f-w-100 f-16 g-l-b">Skills</h4>
								<div class="row">
								<div class="col-md-12">
								<p class="text-muted f-14">{{ Request::get('from_ncs') ? 'Mention your major skills' : 'Candidate skills (mandatory)' }}  : 
									<br/><span class="f-12 text-muted">Start typing here e.g.java, Angular Js, React</span>	</p>
									<span id="js-skill-error"></span>
									</div>
									</div>
									<div class="row">
								<div class="col-md-12">
									{!! Form::select('job_skills[]',$skills,null,['class'=>'form-control js-select2 w-100-p','multiple'=>true,'id'=>'js-skill','data-placeholder'=>'e.g.Java, Angular Js, React']) !!}
							</div>
							</div>
								<span></span>
							</div>
						</div>
						<div class="row form-group">
							<div class="col-md-12">
							<div class="row">
								<div class="col-md-12">
								<p class="text-muted f-14"> {{ Request::get('from_ncs') ? 'Mention your additional skills' : 'Additional skills' }}: 
									<br/><span class="f-12 text-muted">Start typing here e.g.java, Angular Js, React</span>			</p>
									</div></div>
									<div class="row">
								<div class="col-md-12">
								{!! Form::select('additional_skills[]',$scoundrySkills,null,['class'=>'form-control js-select2 w-100-p','multiple'=>true,'id'=>'js-skill2','data-placeholder'=>'e.g.Java, Angular Js, React']) !!}
								<span id="js-skill2-error"></span>							
							</div>
							</div>
							</div>
						</div>
						{!!Form::hidden('from_ncs',Request::get('from_ncs')?Request::get('from_ncs'):false)!!}
			                        {!!Form::hidden('jobid',Request::get('jobid')?Request::get('jobid'):"")!!}
						<div class="row">
							<div class="col-md-7 col-xl-12 col-12 text-center">
								{{ Form::submit("Update Profile",array('class'=>'btn btn-primary m-r-5 md-trigger','id'=>'js-apply')) }}
								<a href="{{ secure_url('candidate-dashboard') }}" class="btn btn-danger">Close</a>
							</div>							
						</div>
						{!! Form::close() !!}
					</div>
				</div>
        </div>
    </div>
</div>

@endsection
@section('footer')
<script>
$(document).ready(function(){
	 $('#apply-job').modal({
      show:true,
      backdrop: 'static',
      keyboard: false,   
  });    
    $(' #js-specialization').prop('disabled', true);
    $(' #js-degree').prop('disabled', true);
    $(' #js-college').prop('disabled', true);
    $('.js-select2').select2({
  		dropdownParent: $('#apply-job')
	});
});

$.validator.addMethod("alphaValidate", function(value, element) {
        return this.optional(element) || /^[a-zA-Z\s]+$/i.test(value);
    });
$.validator.addMethod("otherValueFormat", function(value, element) {
  return this.optional(element) || /^[^-\s][a-zA-Z&'-\s]*$/.test(value);
});

var post_step_1 = $("#js-educational-form").validate({
			errorElement: 'span',
			ignore: '.note-editor *',
			errorPlacement: function (error,element){
	              var parent = $(element).parent();
	              $('.tooltip').tooltip('hide');	              
	              $("body").find('#'+error[0].id+'-custom').remove();
	              $('#'+error[0].id).append('<span data-position="left" data-delay="0" class="js-tootletip hiremee-info text-danger tooltip-validate" id="'+error[0].id+'-custom" data-toggle="tooltip" data-original-title="'+error[0].innerText+'" data-trigger="hover"></span>');
	              $('#'+error[0].id+'-custom').tooltip();
	        },
	        success: function (element){
	          $("body").find('#'+element[0].id+'-custom').remove();
	            $('#'+element[0].id+'-custom').tooltip('hide');
	            $('.js-tooltip-validate').tooltip();
	        },
	        onfocusout: false, 
	        rules: {
				course_type: "required",
				degree: {
					required : true,
					min :1,
				},
				university: {
					required: true,					
				},
				college:{
					required:true,					
				},
				yearofcompletion:{
					required:true,
					number:true
				},
				'job_skills[]':{
					required:true,
					minlength:1,
					maxlength:10,
				},
				'additional_skills[]':{
					minlength:1,
					maxlength:10,
				},
				specialization: {
					required:true,	
					min:1
				},
				others_university:{
                	required:{
                	depends: function(element) {
                  			return ($('#js-university-skill').val()  == '{{getenv("OTHER_UNIVERSITY")}}') ? true : false;
            		}
             		},
					otherValueFormat:true,
             		minlength:2,
					maxlength:200,
	            },
	            others_college:{
	                required:{
	                depends: function(element) {
	                  return ($('#js-college-skill').val()  == '{{getenv("OTHER_COLLEGE")}}' || $('#js-university-skill').val()  == '{{getenv("OTHER_UNIVERSITY")}}') ? true : false;
	                }
	            	},
	            	otherValueFormat:true,
	            	minlength:2,
					maxlength:200,
	            },
					date_of_birth:{
	                	required:true,                    
	               },
	               gender:{
	               	required:true,   
	              },
	              place_of_birth: {
		              required: true,
		               maxlength: 100,
		               minlength: 2,
		              alphaValidate: true,
	             },
	             reges_no: {
		              required: true,
		               maxlength: 15,
		               minlength: 3,
		              alphanumeric: true,
	             }
			},
			messages: {
				course_type:{
					required: "Please select your education details",	
				}, 
				degree: {
					required: "Please select degree",
					min: "Please select degree",
				},
				university:{
					required: "Please select university",
				},
				college: {
					required: "Please Select College",	
				}, 
				yearofcompletion:{
					required: "Please select the year of completion",
				},
				'job_skills[]':{
					required: "Please select atleast one job skill",
					minlength: "Please select atleast one job skill",
					maxlength: "Maximum you can select 10 Job skills",
				},
				'additional_skills[]':{
					minlength: "Please select atleast one additional skill",
					maxlength: "Maximum you can select 10 additional skills",
				},
				specialization:{
					required: "Please select the specialization",
					min: "Please select the specialization",
				},
				date_of_birth:{
                	required:'Please Enter Date of Birth',                   
               },
               reges_no:{
	              required:'Please enter registration number',
	              maxlength:'Maximum should be 15 Characters',
	              minlength: 'Minimum should be 2 characters',
	              alphanumeric: 'Only characters & numbers are allowed',
              },
               gender:{
               	required:'Please select your gender',    
               },
              place_of_birth:{
	              required:'Please enter your place of birth',
	              maxlength:'Maximum should be 100 Characters',
	              minlength: 'Minimum should be 2 characters',
	              alphaValidate: 'Only characters are allowed',
              },
              others_university:{
					required: "Please enter others university",
					otherValueFormat: "Alphabets with special charecter &, ', - are only allowed",
					minlength: "Minimum 2 character required",
        			maxlength: "Maximum 200 character only allowed"
				},
				others_college:{
					required: "Please enter others college",
					otherValueFormat: "Alphabets with special charecter &, ', - are only allowed",
					minlength: "Minimum 2 character required",
        			maxlength: "Maximum 200 character only allowed"
				},
			
			},
			submitHandler: function() {
				 $('#js-apply').prop('disabled',true).val("Processing...");
				document.forms["educational-form"].submit();
			}
		});

$(document).on("change","#js-coursetype",function(){
	      $.ajax({
	        url: "{{ url('get-dropdown-data') }}",
	        dataType: "json",
	        type: "get",
	        data: {"type":'course','value':$(this).val()},
	        success: function(data) {
	          if(data.status == 'true'){
	          	 $(' #js-degree').prop('disabled',false);
	            $('#js-degree').html(data.optionView);
	          }else{
	            alert("Something went wrong");
	          }
	        }
	      });
	    return false;
	});

$(document).on("change","#js-degree",function(){
		if( $(this).val() == '0' ){
			$('#js-specialization').html('<option value="0" selected>Any Specialization</option>');
		}else{
	        $.ajax({
		        url: "{{ url('get-dropdown-data') }}",
		        dataType: "json",
		        type: "get",
		        data: {"type":'specialization','value':$(this).val()},
		        success: function(data) {
		          if(data.status == 'true'){
		          	$(' #js-specialization').prop('disabled',false);
		            $('#js-specialization').html(data.optionView);
		          }else{
		            alert("Something went wrong");
		          }
		        }
	        });
    	}
	    return false;
	});

$(document).on("change","#js-university",function(){
		if( $(this).val() == '0' ){
			$('#js-college').html('<option value="0" selected>Select College</option>');
		}else{
	        $.ajax({
		        url: "{{ url('get-dropdown-data') }}",
		        dataType: "json",
		        type: "get",
		        data: {"type":'universityid','value':$(this).val()},
		        success: function(data) {
		          if(data.status == 'true'){
		          	$(' #js-college').prop('disabled', false);
		            $('#js-college').html(data.optionView);
		          }else{
		            alert("Something went wrong");
		          }
		        }
	        });
    	}
	    return false;
	});
   
   $(document).on("change","#js-university-skill",function(){
		$('#js-college-skill').prop('disabled', false);
		$('#others_details').addClass('d-none');
		$('#others_details_college').addClass('d-none');
		$('#js-others_university').val('');
		$('#js-others_college').val('');
		if( $(this).val() == '' ){
			$('#js-college-skill').html('<option value="" selected>College</option>');
		}else{
			var other_university = $(this).val();
	        $.ajax({
		        url: "{{ url('get-dropdown-data') }}",
		        dataType: "json",
		        type: "get",
		        data: {"type":'universityid','value':$(this).val()},
		        success: function(data) {
		          if(data.status == 'true'){
		            $('#js-college-skill').html(data.optionView);
		          	$('#js-college-skill').prop('disabled', false);
	            	if(other_university == '{{getenv("OTHER_UNIVERSITY")}}'){
						$('#others_details').removeClass('d-none');
						$('#others_details_college').removeClass('d-none');
						$('#js-college-skill').val('{{getenv("OTHER_COLLEGE")}}').trigger('change');
      					// $(' #js-college-skill').prop('disabled', true);
					}	            
		          }else{
		            alert("Something went wrong");
		          }
		        }
	        });
    	}
	    return false;
	});

	

		$(document).on("change","#js-college-skill",function(){
		if($(this).val() == '{{getenv("OTHER_COLLEGE")}}'){
			$('#js-others_college').val('');
			$('#others_details_college').removeClass('d-none');
		}else{
			$('#js-others_college').val('');
			$('#others_details_college').addClass('d-none');
		}
	});
</script>
@endsection