@extends('admin.layout.master')

@section('content')

<div class="app-content  my-3 my-md-5">
		<div class="side-app">
			<div class="page-header">
				<h4 class="page-title">Second Level Category Add</h4>
				<ol class="breadcrumb">
					<li class="breadcrumb-item"><a href="{{ route('admin.catList') }}">Category</a></li>
					<li class="breadcrumb-item active" aria-current="page">Second Level Category Add</li>
				</ol>

			</div>
			<div class="row ">
				
				<div class="col-lg-12">
					<form class="card" method="post" action="{{route('admin.cat2Store')}}" onsubmit="return catAdd()">
						@csrf
						<div class="card-header">
							<h3 class="card-title">Second Level Category Add</h3>
						</div>
						<div class="card-body">
							<div class="row">
								
								<div class="col-sm-6 col-md-12">
									<div class="form-group">
										<label class="form-label">First Level Category</label>
										<span><h5 id="parentcheck" style="color: red; display: none;">  </h5></span>
										<select class="form-control" name="parent" id="catid">
											<option value="0">--Select--</option>
											@if(!$cat->isEmpty())
											@foreach($cat as $val)
											<option value="{{$val->id}}">{{$val->cat_name}}</option>
											@endforeach
											@endif
										</select>
									</div>
								</div>
								<div class="col-sm-6 col-md-6">
									<div class="form-group">
										<label class="form-label">Second Level Category</label>
										<span><h5 id="childcheck" style="color: red; display: none;">  </h5></span>
										<input type="text" class="form-control" placeholder="Sub Category" name="subcat" id="subcat">
									</div>
								</div>								
							</div>
						</div>
						<div class="card-footer text-center">
							<button type="submit" class="btn btn-primary btn-lg custom-btn mr-2" >Save</button>
						</div>
					</form>
				</div>
			</div>
		</div>
	</div>
@endsection

@section('scripts')
<script type="text/javascript">
	function catAdd() {
		var parent = $('#catid').val();
		var name = $('#subcat').val();

		if(parent == '0')
		{
			$('#parentcheck').show();
			$('#parentcheck').html('** Please Select This Field');
			setTimeout(function(){
				  $('#parentcheck').hide();
				}, 2000);

			return false;
		}
		else if(name == '')
		{
			$('#childcheck').show();
			$('#childcheck').html('** Please Fill This Field');
			setTimeout(function(){
				  $('#childcheck').hide();
				}, 2000);

			return false;
		}
		else
		{
			return true;
		}
	}
</script>
@endsection