@extends('layouts.admin.app')

@section('content')

<!-- Page Wrapper -->
<div class="page-wrapper">
	<!-- Page Content -->
    <div class="content container-fluid">
        <div class="crms-title row bg-white">
            <div class="col">
                <h3 class="page-title m-0">
                <span class="page-title-icon bg-primary text-white mr-2">
                    <i class="fa fa-user-o" aria-hidden="true"></i>
                </span> Manage Child Category </h3>
            </div>
            <div class="col text-right">
                <ul class="breadcrumb bg-white float-right m-0 pl-0 pr-0">
                    <li class="breadcrumb-item"><a href="{{url('/admin/home')}}">Dashboard</a></li>
                    <li class="breadcrumb-item active">Child Category</li>
                </ul>
            </div>
        </div>
        
        <!-- Page Header -->
        <div class="page-header pt-3 mb-0 ">
            <div class="row">
                <div class="col"> 
                </div>
                <div class="col text-right">
                    <ul class="list-inline-item pl-0">
                        <li class="list-inline-item">
                            <a href="{{route('child-category.index')}}" class="add btn btn-primary font-weight-bold text-white todo-list-add-btn btn-rounded" id="add-task">Back</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <!-- /Page Header -->
        
        <!-- Content Starts -->
        <div class="row">
            <div class="col-md-12">
                <div class="card mb-0">
                    <div class="card-body">
                    <span id="form_result"></span>  
                        <form method="Post" id="update_child_category_form" class="form-horizontal" enctype="multipart/form-data">
                            @csrf
                            <input type="hidden" name="editid" value="{{$childcategories->id}}">
                            <div class="form-group row">
                                <div class="col-sm-12">
                                    <label class="col-form-label">Child Category name </label>
                                    <input type="text" name="child_category_name" class="form-control" value="{{ $childcategories->child_category_name }}" placeholder="Category name">
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-sm-12">
                                    <label class="col-form-label">Choose Category </label>
                                    <select class="form-control" name="cat_id" id="cat_id">
                                    <option value="">select main category</option>
                                    @foreach($categories as $category)
                                    <option value="{{$category->id}}" {{$category->id == $childcategories->cat_id ? 'selected' : ''}}> {{$category->category_name}} </option>
                                    @endforeach
                                    </select>  
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-sm-12">
                                    <label class="col-form-label">Choose Status </label>
                                    <select class="form-control" name="status" id="status">
                                        <option value="">Select status</option>    
                                        <option {{ $childcategories->status == '1'? 'selected' : '' }}  value="1">Active</option>
                                        <option  {{ $childcategories->status == '0'? 'selected' : '' }} value="0">In-active</option>
                                    </select>  
                                </div>
                            </div>
                            <div class="text-center py-3">
                                <input type="submit" id="ajaxSubmit1" class="border-0 btn btn-primary btn-gradient-primary btn-rounded" value="Save">
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <!-- /Content End -->
        
    </div>
    <!-- /Page Content -->
    
</div>
<!-- /Page Wrapper -->

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
    $(document).ready(function(){

    $('#update_child_category_form').on('submit', function(event){
    event.preventDefault();
    $.ajax({
    url:"{{ url('admin/update/child-category') }}",
    headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
    method:"POST",
    data:new FormData(this),
    dataType:'JSON',
    contentType: false,
    cache: false,
    processData: false,
    success:function(data)
    {
            var html = '';
            if(data.errors)
            {
            html = '<div class="alert alert-danger">';
            for(var count = 0; count < data.errors.length; count++)
            {
            html += '<p>' + data.errors[count] + '</p>';
            }
            html += '</div>';
            }
            if(data.success)
            {
            html = '<div class="alert alert-success">' + data.success + '</div>';
            }
            $('#form_result').html(html);
        }
    })
    });

    });
</script>

@endsection