@extends('layouts/microfin_layout')
@section('title', '| Add Member')
@section('content')
	<style type="text/css">
		#rootwizard .panel-body .row {
			margin-bottom: 10px;
		}
		#rootwizard, 
		#rootwizard .form-control {
			font-size: 11px !important;
			padding: 5px !important;
		}
		#rootwizard input[type='text'],
		#rootwizard select {
			height: 28px !important;
		}
		#rootwizard label {
			margin-bottom: 0 !important;
			color: #555 !important;
		}
		.validate-has-error {
			color: #FF0000;
		}
		#profileImagePreview {
			width: 150px;
		    height: 200px;
		    border: 1px solid #bebebe;
		    padding: 3px;
		    margin: 5px 5px 5px 0;
		}
		#regularSignatureImagePreview,
		#nIDSignatureImagePreview {
			width: 200px;
		    height: 100px;
		    border: 1px solid #bebebe;
		    padding: 3px;
		    margin: 5px 5px 5px 0;
		}
		.profileImage,
		.signature {
			margin-top: 5px;
		}
		
	</style>
	<div class="row add-data-form">
		<div class="col-md-12">
            <div class="col-md-10 col-md-offset-1 fullbody">
            	<div class="viewTitle" style="border-bottom:1px solid white;">
                    <a href="{{ url('viewMember/') }}" class="btn btn-info pull-right addViewBtn">
                    	<i class="glyphicon glyphicon-th-list viewIcon"></i>
                    	Member Lists
                    </a>
                </div>
                <div class="panel panel-default panel-border">
                	<div class="panel-heading">
                        <div class="panel-title">New Member for Opening Balance</div>
                                            </div>
                    <div class="panel-body">
                    	<div class="row">
							{!! Form::open(array('name' => 'memberForm', 'url' => '', 'role' => 'form', 'id' => 'rootwizard', 'files' => 'true', 'class' => 'form-wizard validate', 'novalidate' => '')) !!}
								<ul class="tabs">
									<li class="active">
										<a href="#fwv-1" data-toggle="tab">Member Details</a>
									</li>
									<li>
										<a href="#fwv-2" data-toggle="tab">Photo</a>
									</li>
								</ul>
								<div class="progress-indicator">
									<span></span>
								</div>
								<div class="tab-content no-margin">
									<div class="tab-pane with-bg active" id="fwv-1">
										<div class="panel panel-default" style="padding:0!important;">
											<div class="panel-heading" style="padding:5px 10px;background:#708090;color:#FFF;border-bottom:none!important">Member</div>
											<div class="panel-body" style="padding:5px 10px;">
												<div class="row">
													<div class="col-xs-3">
														{!! Form::label('samity name', 'Samity Name:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::select('samityId', ($damageData['samities']), null, array('class'=>'form-control', 'id' => 'samityId', 'data-validate' => 'required')) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('member name', 'Member Name:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('name', $value = null, ['class' => 'form-control', 'id' => 'name', 'type' => 'text', 'data-validate' => 'required']) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('member surname', 'Member Surname:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('surName', $value = null, ['class' => 'form-control', 'id' => 'surName', 'type' => 'text']) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('admission date', 'Admission Date:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('admissionDate', $value = null, ['class' => 'form-control datepicker', 'id' => 'admissionDate', 'type' => 'text', 'readonly' => 'readonly', 'data-validate' => 'required']) !!}
													</div>
												</div>
												<div class="row">
													<div class="col-xs-3">
														{!! Form::label('primary product', 'Primary Product:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::select('primaryProductId', (array('' => 'Select') + $damageData['primaryProduct']), null, array('class'=>'form-control', 'id' => 'primaryProductId', 'data-validate' => 'required')) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('member code', 'Member Code:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('code', $value = null, ['class' => 'form-control', 'id' => 'code', 'type' => 'text', 'readonly' => 'readonly', 'data-validate' => 'required']) !!}
													</div>

													<div class="col-xs-3" hidden>
														{!! Form::label('member code', 'Member Code:*', ['class' => 'control-label']) !!}
														<br/> {!! Form::text('newMemberCode', $value = null, ['class' => 'form-control', 'id' => 'newMemberCode', 'type' => 'text', 'readonly' => 'readonly']) !!}
													</div>

													<div class="col-xs-3">
														{!! Form::label('gender', 'Gender:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::select('gender', array('' => 'Select'), null, array('class'=>'form-control', 'id' => 'gender', 'data-validate' => 'required')) !!}
													</div>
													<div class="col-xs-2">
														{!! Form::label('date of birth', 'Date of Birth:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('dob', $value = null, ['class' => 'form-control datepicker', 'id' => 'dob', 'type' => 'text', 'readonly' => 'readonly', 'data-validate' => 'required']) !!}
													</div>
													<div class="col-xs-1">
														{!! Form::label('age', 'Age:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('age', $value = null, ['class' => 'form-control', 'id' => 'age', 'type' => 'text', 'data-validate' => 'required', 'readonly' => 'readonly' ]) !!}
													</div>
												</div>
												<div class="row">
													<div class="col-xs-3">
														{!! Form::label('marital status', 'Marital Status:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::select('maritalStatus', ($damageData['maritalStatus']), null, array('class'=>'form-control', 'id' => 'maritalStatus', 'data-validate' => 'required')) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('Father/Spouse Name', 'Father/Spouse Name:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('spouseName', $value = null, ['class' => 'form-control', 'id' => 'spouseFatherSonName', 'type' => 'text', 'data-validate' => 'required']) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('relationship', 'Relationship:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::select('relationship', ($damageData['relationship']), null, array('class'=>'form-control', 'id' => 'relationship', 'data-validate' => 'required')) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('admission fee', 'Admission Fee:', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('admissionFee', $value = null, ['class' => 'form-control', 'id' => 'admissionFee', 'type' => 'text']) !!}
													</div>
												</div>
												<div class="row">
													<div class="col-xs-3">
														{!! Form::label('admission no', 'Admission No:', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('admissionNo', $value = null, ['class' => 'form-control', 'id' => 'admissionNo', 'type' => 'text']) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('national ID', 'National ID:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('nID', $value = null, ['class' => 'form-control', 'id' => 'nID', 'type' => 'text', 'data-validate' => 'minlength[13]', 'autocomplete' => 'off']) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('birth registration no', 'Birth Registration No:', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('birthRegNo', $value = null, ['class' => 'form-control', 'id' => 'birthRegNo', 'type' => 'text', 'autocomplete' => 'off']) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('passport no', 'Passport No:', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('passportNo', $value = null, ['class' => 'form-control', 'id' => 'passportNo', 'type' => 'text', 'autocomplete' => 'off']) !!}
													</div>
												</div>
												<div class="row">
													<div class="col-xs-3">
														{!! Form::label('group', 'Group:', ['class' => 'control-label']) !!} <br/>
														{!! Form::select('groupId', array('' => 'Select'), null, array('class'=>'form-control', 'id' => 'groupId')) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('sub group', 'Sub Group:', ['class' => 'control-label']) !!} <br/>
														{!! Form::select('subGroupId', array('' => 'Select'), null, array('class'=>'form-control', 'id' => 'subGroupId')) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('education level', 'Education Level:', ['class' => 'control-label']) !!} <br/>
														{!! Form::select('maxEducation', ($damageData['educationLevel']), null, array('class'=>'form-control', 'id' => 'maxEducation')) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('mobile no', 'Mobile No:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('mobileNo', $value = null, ['class' => 'form-control', 'id' => 'mobileNo', 'type' => 'text']) !!}
														{{-- {!! Form::text('mobileNo', $value = null, ['class' => 'form-control', 'id' => 'mobileNo', 'type' => 'text', 'data-validate' => 'required, minlength[11], maxlength[11]']) !!} --}}
													</div>
												</div>
												<div class="row">
													<div class="col-xs-3">
														{!! Form::label('form applicatin no', 'Form Applicatin No:', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('formApplicationNo', $value = null, ['class' => 'form-control', 'id' => 'formApplicationNo', 'type' => 'text']) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('nationality', 'Nationality:', ['class' => 'control-label']) !!} <br/>
														{!! Form::select('nationality', ($damageData['country']), null, array('class'=>'form-control', 'id' => 'nationality')) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('smart Card', 'Smart Card:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('smartCardNo', $value = null, ['class' => 'form-control', 'id' => 'smartCardNo', 'type' => 'text', 'data-validate' => 'minlength[10], maxlength[10]', 'autocomplete' => 'off']) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('father Name', 'Father Name:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('fatherName', $value = null, ['class' => 'form-control', 'id' => 'fatherName', 'type' => 'text', 'autocomplete' => 'off']) !!}
													</div>
												</div>
												<div class="row">
													<div class="col-xs-3">
														{!! Form::label('mother Name', 'Mother Name:*', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('motherName', $value = null, ['class' => 'form-control', 'id' => 'motherName', 'type' => 'text', 'autocomplete' => 'off']) !!}
													</div>
												</div>
											</div>
										</div>
										<div class="panel panel-default" style="padding:0!important;">
											<div class="panel-heading" style="padding:5px 10px;background:#708090;color:#FFF;border-bottom:none!important">Contact Details</div>
											<div class="panel-body" style="padding:5px 10px;">
												<div class="row">
													<div class="col-xs-12">
														<h6 style="border-bottom:1px solid #dedede;padding-bottom:3px;">Present Address</h6>
													</div>
												</div>
												<div class="row">
													<div class="col-xs-3">
														{!! Form::label('village / ward', 'Village / Ward:*:', ['class' => 'control-label']) !!} <br/>
														{!! Form::textarea('curVillageWard', $value = null, ['class' => 'form-control', 'id' => 'curVillageWard', 'type' => 'textarea', 'rows' => '3', 'cols' => '50', 'readonly' => 'readonly']) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('family / home contact no', 'Family / Home Contact No:', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('curFamilyHomeMobileNo', $value = null, ['class' => 'form-control', 'id' => 'curFamilyHomeMobileNo', 'type' => 'text']) !!}
													</div>
												</div>
												<div class="row">
													<div class="col-xs-12">
														<h6 style="border-bottom:1px solid #dedede;padding-bottom:3px;">Permanent Address</h6>
													</div>
												</div>
												<div class="row">
													<div class="col-xs-3">
														{!! Form::label('same as present address', 'Same as present address:', ['class' => 'control-label']) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::checkbox('sameAsPresentAddress', 1, false, array('class' => 'cbr', 'id' => 'sameAsPresentAddress')) !!}
													</div>
												</div>
												<div class="row">
													<div class="col-xs-3">
														{!! Form::label('village / ward', 'Village / Ward:*:', ['class' => 'control-label']) !!} <br/>
														{!! Form::textarea('permVillageWard', $value = null, ['class' => 'form-control', 'id' => 'permVillageWard', 'type' => 'textarea', 'rows' => '3', 'cols' => '50']) !!}
													</div>
													<div class="col-xs-3">
														{!! Form::label('family / home contact no', 'Family / Home Contact No:', ['class' => 'control-label']) !!} <br/>
														{!! Form::text('permFamilyHomeMobileNo', $value = null, ['class' => 'form-control', 'id' => 'permFamilyHomeMobileNo', 'type' => 'text']) !!}
													</div>
												</div>
											</div>
										</div>



										{{-- savings  --}}
										<div class="panel panel-default" id="savingsPanel" style="padding:0!important;">
											<div class="panel-heading" style="padding:5px 10px;background:#708090;color:#FFF;border-bottom:none!important">Savings</div>
											<div class="panel-body" style="padding:5px 10px;">
												<div class="row">
													<div class="col-xs-6">
														<div class="row">
															<div class="col-xs-6">
																{!! Form::label('product', 'Product:*', ['class' => 'control-label']) !!}
																<br/> {!! Form::select('savingsProductId', ($damageData['mandatorySavingsProduct']), null, array('class'=>'form-control', 'id' => 'savingsProductId', 'data-validate' => 'required')) !!}
															</div>
														</div>
														<div class="row">
															<div class="col-xs-6">
																{!! Form::label('deposit type', 'Deposit Type:', ['class' => 'control-label']) !!}
																<br/> {!! Form::text('depositTypeId', $value = null, ['class' => 'form-control', 'id' => 'depositTypeId', 'type' => 'text', 'readonly' => 'readonly']) !!}
															</div>
														</div>
														<div class="row">
															<div class="col-xs-6">
																{!! Form::label('interest rate', 'Interest Rate:', ['class' => 'control-label']) !!}
																<br/> {!! Form::text('savingsInterestRate', $value = null, ['class' => 'form-control', 'id' => 'savingsInterestRate', 'type' => 'text', 'readonly' => 'readonly']) !!}
							
															</div>
															<div style="padding-top:4%!important;padding-left:0!important" class="col-xs-1">
																<span style="vertical-align:middle">%</span>
															</div>
														</div>
														<div class="row">
															<div class="col-xs-6">
																{!! Form::label('saving code', 'Saving Code:*', ['class' => 'control-label']) !!}
																<br/> {!! Form::text('savingsCode', $value = null, ['class' => 'form-control', 'id' => 'savingsCode', 'type' => 'text', 'data-validate' => 'required', 'readonly' => 'readonly']) !!}
															</div>
														</div>
													</div>
							
													<div class="col-xs-6">
														<div class="row">
															<div class="col-xs-6">
																{!! Form::label('auto process amount', 'Auto Process Amount:', ['class' => 'control-label']) !!}
																<br/> {!! Form::text('savingsAmount', $value = null, ['class' => 'form-control', 'id' => 'savingsAmount', 'type' => 'text', 'data-validate' => 'required,minlength[1]']) !!}
															</div>
														</div>
													</div>
												</div>
											</div>
										</div>
										{{-- end of savings  --}}



									</div>
									<div class="tab-pane with-bg" id="fwv-2">
										<div class="row">
											<div class="panel panel-default" style="padding:0!important;">
												<div class="panel-heading" style="padding:5px 10px;background:#708090;color:#FFF;border-bottom:none!important">Upload Photo</div>
												<div class="panel-body" style="padding:5px 10px;">
													<div class="row">
														<div class="col-xs-6">
															<div class="col-xs-6">
																{!! Form::label('profile picture', 'Profile Picture:', ['class' => 'control-label']) !!} <br/>
																<img id="profileImagePreview" src="{{ asset('images/image-4.jpg') }}" class="img-responsive img-rounded full-width">
																{!! Form::file('profileImage', array('class' => 'profileImage', 'onchange' => 'loadProfileImageFile(event)')) !!}
															</div>
														</div>
														<div class="col-xs-6">
															<div class="col-xs-6">
																<div class="row">
																	<div class="col-xs-12">
																		{!! Form::label('regular signature', 'Regular Signature:', ['class' => 'control-label']) !!} <br/>
																		<img id="regularSignatureImagePreview" src="{{ asset('images/image-5.jpg') }}" class="img-responsive img-rounded full-width margin-bottom">
																		{!! Form::file('regularSignatureImage', array('class' => 'signature', 'onchange' => 'loadRegularSignatureImageFile(event)')) !!}
																	</div>			
																</div>
																<div class="row">
																	<div class="col-xs-12">
																		{!! Form::label('national id signature', 'National ID Signature:', ['class' => 'control-label']) !!} <br/>
																		<img id="nIDSignatureImagePreview" src="{{ asset('images/image-5.jpg') }}" class="img-responsive img-rounded full-width margin-bottom">
																		{!! Form::file('nIDSignatureImage', array('class' => 'signature', 'onchange' => 'loadnIDSignatureImageFile(event)')) !!}
																	</div>
																</div>
															</div>
														</div>
													</div>
												</div>
											</div>
										</div>
									</div>
									<ul class="pager wizard" style="float:right;">
										<li class="previous">
											<a class="btn btn-white" style="float:none;" href="#"><i class="entypo-left-open"></i>Previous</a>
										</li>
										<li class="submitBtn"></li>
										<li class="next">
											<a class="btn btn-white" style="float:none;" href="#">Next<i class="entypo-right-open"></i></a>
										</li>
									</ul>
								</div>
							{!! Form::close() !!}
                        </div>
                    </div>
                </div>
            </div>
		</div>
	</div>
	<script type="text/javascript">	
		$(".datepicker").datepicker({
            changeMonth: true,
            changeYear: true,
            dateFormat: 'dd-mm-yy',
            yearRange: '1950:c',
        });
        
		var loadProfileImageFile = function(event) {
			var profileImagePreview = document.getElementById('profileImagePreview');
			profileImagePreview.src = URL.createObjectURL(event.target.files[0]);
		};

		var loadRegularSignatureImageFile = function(event) {
			var regularSignatureImagePreview = document.getElementById('regularSignatureImagePreview');
			regularSignatureImagePreview.src = URL.createObjectURL(event.target.files[0]);
		};

		var loadnIDSignatureImageFile = function(event) {
			var nIDSignatureImagePreview = document.getElementById('nIDSignatureImagePreview');
			nIDSignatureImagePreview.src = URL.createObjectURL(event.target.files[0]);
		};

		$(document).ready(function(){
	        $(document).on('click', '.cbr-replaced', function() {
	        	if($(this).hasClass('cbr-checked')==true) {
		        	$('#permVillageWard').val($('#curVillageWard').val());
		        	$('#permPostOfficeArea').val($('#curPostOfficeArea').val());
		        	$('#permFamilyHomeMobileNo').val($('#curFamilyHomeMobileNo').val());
	        	} 
	        	if($(this).hasClass('cbr-checked')==false) {
		        	$('#permVillageWard').val('');
		        	$('#permPostOfficeArea').val('');
		        	$('#permFamilyHomeMobileNo').val('');
	        	}
	        	if($(this).find('.cbr').hasClass('continueWithSavings')==true) {
		        	if($(this).hasClass('cbr-checked')==true) 
		        		$('#savingsPanel').removeClass('hidden').addClass('animated fadeInUp');
		        	if($(this).hasClass('cbr-checked')==false) 
		        		$('#savingsPanel').addClass('hidden').addClass('animated fadeInDown');
	        	}
	        });


			$('#is13digitnid').prop( "checked", false );

			$(document).on('change', '#is13digitnid', function(){
				$("#is13digitnid-error").remove();
				let isclicked = ($('#is13digitnid').prop('checked'));
				if(isclicked){
					let dob = $("#dob").val();
					if(!dob){
						$("#is13digitnid").parent().append('<br><span id="is13digitnid-error" class="validate-has-error"></span>');
						$("#is13digitnid-error").text('Please select date of birth !!').show();
						$('#is13digitnid').prop( "checked", false );
						return;
					}
					dob = dob.slice(dob.length - 4);
					let nid = dob + $("#nID").val();
					$("#nID").val(nid);
				}
			});

	        $(document).on('click', '.previous', function() {
	        	$('.submitBtn').empty();
	        });
	        $(document).on('click', '.next', function() {
	        	$('.submitBtn').html('<input id="submit" class="btn btn-info" type="submit" value="Submit">');
	        });

	        $(document).on('change', '#samityId', function() {
	        	$('#gender').empty();
				$('#code').val("");

	        	$.ajax({
			        type: 'post',
			        url: './reqMemberCode',
			        dataType: 'json',
			        data: {
			        	'_token': "{{ csrf_token() }}",
			        	'id': $('#samityId').val()
			       	}, 
			        success: function(_response) {
                        if(_response.errors) {
                            alert(_response.errors);
                        } else {
                       		if(_response.samityOpeningDate>_response.softwareDate) {
                       			alert('Your selected samity opening date is greater than member admission date. Please change back the opening date of the samity.');
                       			$('#samityId').val('');
                       		}

                       		if(_response.samityOpeningDate<=_response.softwareDate) {
								$('#code').val(_response.code);
                        		$('#newMemberCode').val(_response.newMemberCode);

	                       		$.each(_response.samityTypeOptions, function(index, value) {
			                        $('#gender').append('<option value="'+ index +'" selected="selected">' + value + '</option>');
			                    });

			                    $('#gender option[value=""]').insertBefore('#gender option[value="1"]');
			                    $('#curVillageWard').val(_response.presentAddress);
			                }
                        }
                    },
                    error: function(_response) {
                        alert(_response.errors);
                    }
			    });
	        });


			$(document).on('change', '#savingsProductId', function() {
            if ($('#samityId').val() == '') {
                toastr.success('Please select a samity first.', 'Warning', opts);
                $('#savingsProductId').val('');
                return false;
            }

            if ($('#savingsProductId').val() == '') {
                $('#depositTypeId').val('');
                $('#savingsInterestRate').val('');
                $('#savingsCode').val('');
                $('#savingsAmount').val('');
                return false;
            }

            $.ajax({
                type: 'post',
                url: './reqMandatorySavingsDetails',
                dataType: 'json',
                data: {
                    '_token': "{{ csrf_token() }}",
                    'id': $('#savingsProductId').val(),
                    'code': $('#code').val(),
                    'memberCode': $('#newMemberCode').val()
                },
                success: function(_response) {
                    if (_response.errors) {
                        alert(_response.errors);
                    } else {
                        $('#depositTypeId').val(_response.mandatorySavingsDetailsOB.depositType);
                        $('#savingsInterestRate').val(parseFloat(_response.mandatorySavingsDetailsOB.interestRate).toFixed(2));
                        $('#savingsCode').val(_response.mandatorySavingsDetailsOB.savingsCode);
                        $('#savingsAmount').val(_response.mandatorySavingsDetailsOB.weeklyDepositAmount);
                    }
                },
                error: function(_response) {
                    alert(_response.errors);
                }
            });
        });

        $(document).on('keyup', '#savingsAmount', function() {
            if ($('#savingsAmount').val() == '' || $('#savingsAmount').val() < 1) {
                alert('Please enter a valid number as auto process amount.');
                $('#savingsAmount').val('');
                return false;
            }
        });

	        $(document).on('change', '#dob', function() {
	        	$.ajax({
			        type: 'post',
			        url: './reqOpeningBalanceMemberAge',
			        dataType: 'json',
			        data: {
			        	'_token': "{{ csrf_token() }}",
			        	'dob': $('#dob').val()
			       	}, 
			        success: function(_response) {
                        if(_response.errors) {
                            alert(_response.errors);
                        } else {
                       		if(_response.catchErr!=1)
                       			$('#age').val(_response.memberAge);
                       		if(_response.catchErr==1) {
                       			$('#dob').val('');
                       			$('#age').val('');
                       			toastr.success(_response.errMsg, 'Warning', opts);
                       		}
                        }
                    },
                    error: function(_response) {
                        alert(_response.errors);
                    }
			    });
	        });

			$(document).on('keyup', '#nID', function() {
				let isValid = checkNIDValidity($(this).val());
				if(!isValid) return;

				$("#nID-error").remove();            
				
				$.ajax({
					type: 'post',
					url: './reqOpeningBalanceNIDDuplicacyCheck',
					dataType: 'json',
					data: {
						'nID': $('#nID').val()
					},
					success: function(_response) {         
						console.log(_response);           
						if (_response.nIDexists == 1) {
							$("#nID").parent().append('<span id="nID-error" class="validate-has-error"></span>');
							$("#nID-error").text('This national ID is already taken.').show();

							setTimeout(function() {
								$("#nID").val('');
							}, 500);
						}                    
					},
					error: function(_response) {
						console.log(_response.errors);
					}
				});            
			});

			$(document).on('keyup', '#birthRegNo', function() {

	        	if($('#birthRegNo').val()==='')
	        		return false;

	        	$("#birthRegNo-error").remove();
	        	
	        	$.ajax({
			        type: 'post',
			        url: './reqOpeningBalanceBirthRegNoDuplicacyCheck',
			        dataType: 'json',
			        data: {
			        	'birthRegNo': $('#birthRegNo').val()
			       	}, 
			        success: function(_response) {
                        if(_response.errors) {
                            alert(_response.errors);
                        } else {
                   			if(_response.birthRegNoExists==1) {
                   				$("#birthRegNo").parent().append('<span id="birthRegNo-error" class="validate-has-error"></span>');
                   				$("#birthRegNo-error").text('This birth registration no. is already taken.').show();

                   				setTimeout(function(){
	                                $("#birthRegNo").val('');
	                                
	                                $(document).on("keypress", function(e) {
									    $("#birthRegNo-error").remove();
									});
	                            }, 500);
                   			}
                        }
                    },
                    error: function(_response) {
                        alert(_response.errors);
                    }
			    });   			        	
	        });

			$(document).on('keyup', '#passportNo', function() {
	        	if($('#birthRegNo').val()==='')
	        		return false;
	        	
	        	$("#passportNo-error").remove();
				
				$.ajax({
			        type: 'post',
			        url: './reqOpeningBalancePassportNoDuplicacyCheck',
			        dataType: 'json',
			        data: {
			        	'passportNo': $('#passportNo').val()
			       	}, 
			        success: function(_response) {
                        if(_response.errors) {
                            alert(_response.errors);
                        } else {
                   			if(_response.passportNoExists==1) {
                   				$("#passportNo").parent().append('<span id="passportNo-error" class="validate-has-error"></span>');
                   				$("#passportNo-error").text('This passport no. is already taken.').show();

                   				setTimeout(function(){
	                                $("#passportNo").val('');
	                                
	                                $(document).on("keypress", function(e) {
									    $("#passportNo-error").remove();
									});
	                            }, 500);
                   			}
                        }
                    },
                    error: function(_response) {
                        alert(_response.errors);
                    }
			    });   			        	
	        });

			$(document).on('keyup', '#mobileNo', function() {
				if ($('#mobileNo').val().length == 11) {
					$("#mobileNo-error").remove();
					$.ajax({
						type: 'post',
						url: './reqOpeningBalanceMobileNoDuplicacyCheck',
						dataType: 'json',
						data: {
							'mobileNo': $('#mobileNo').val()
						}, 
						success: function(_response) {
							if(_response.errors) {
								alert(_response.errors);
							} else {
								if(_response.mobileNoExists==1) {
									$("#mobileNo").parent().append('<span id="mobileNo-error" class="validate-has-error"></span>');
									$("#mobileNo-error").text('This mobile no. is already taken.').show();

									setTimeout(function(){
										$("#mobileNo").val('');
									}, 1000);
								}
							}
						},
						error: function(_response) {
							alert(_response.errors);
						}
					});   			
				}
	        });


			function checkNIDValidity(nid = ""){
				$("#nID-error").remove();
				$("#nID").parent().append('<span id="nID-error" class="validate-has-error"></span>');

				let reg = new RegExp('^[0-9]+$');        
				if(!reg.test(nid)){
					$("#nID-error").text('NID must contain numbers only !!').show();
					return false;
				}

				if(nid.length != 13 && nid.length != 17){
					$("#nID-error").text('NID must contain 13 or 17 digits !!').show();
					return false;
				}

				reg = new RegExp('^0000');
				if(nid.length == 17 && reg.test(nid)){
					$("#nID-error").text('First 4 digits can not be 0000 !!').show();
					return false;
				}
			
				reg = new RegExp('^0');
				if(nid.length == 17 && reg.test(nid)){
					$("#nID-error").text('17 digit NID can not have start with 0 !!').show();
					return false;
				}

				$("#nID-error").remove();
				return true;
			}

	        $('form').submit(function(event){
	            event.preventDefault();

				let nID = $('#nID').val();  

				if(nID && nID.length == 13){
					let dob = $('#dob').val();
					nID = dob.slice(dob.length - 4) + nID;
					$("#nID").val(nID);
				}
	            
				var form = document.forms.namedItem("memberForm");
			    var formData = new FormData(form); 

			    $.ajax({
			        type: 'post',
			        url: './addOpeningBalanceMemberItem',
			        dataType: 'json',
			        contentType: false, 
			        data: formData, 
			        processData: false,
			        success: function(_response) {
                        if(_response.errors) {
                            alert(_response.errors);
                        } else {
                            // toastr.success(_response.responseText, _response.responseTitle, opts);
                            
                            // setTimeout(function(){
                            //     window.location.href = '{{ url('viewMember/') }}';
                            // }, 3000);


							if(_response.responseTitle == "Success!"){
                            toastr.success(_response.responseText, _response.responseTitle, opts);
                            setTimeout(function(){
                                window.location.href = '{{ url('viewMember/') }}';
                            }, 2000);
							}else{
								toastr.warning(_response.responseText, _response.responseTitle, opts);
							}


                        }
                    },
                    error: function(_response) {
                        alert(_response.errors);
                    }
			    });

	        });

	        $(document).on('input', "#mobileNo", function(event) {
	       	  	this.value = this.value.replace(/[^0-9]/g, '').replace(/(\..*)\./g, '$1');
	       	});
	       	$(document).on('input', "#name", function(event) {
	       	  	$(this).val($(this).val().replace(/[^A-Za-z\s]/g, ''));
	       	});
			$(document).on('input', "#nID", function(event) {
				this.value = this.value.replace(/[^0-9]/g, '').replace(/(\..*)\./g, '$1');
			});

	    });
	</script>
@endsection