@extends ('backend.layouts.app')

@section('title', 'New Forms creation')

@section('page-header')
<h1>New Forms creation</h1>
@endsection

@section('after-styles')
<link rel="stylesheet" href="{{ asset('js/sweetalert2/sweetalert2.min.css') }}">
<link rel="stylesheet" href="{{ asset('js/toastr/toastr.min.css') }}" />
@endsection

@section('content')
<div class="box box-info">
    <div class="box-header with-border">
        <h5 class="card-title">Create New Form</h5>
        <button type="button" id="clearForm" class="btn btn-info">
            Clear Form 
        </button>
        <button type="button" id="saveForm" class="btn btn-primary">
            Save &amp; Submit Form
        </button>

    </div><!--box-header with-border-->

    <div class="box-body">
        <form id="createFormForm" method="POST" action="{{ route('admin.form-manager.store') }}">
            @csrf
            <div class="col-md-6">
                <label for="form-name" class="form-label">Form Name</label>
                <input type="text" class="form-control" id="form-name" name="form-name" required />
            </div>
            <div class="col-md-6">
                <label for="event-db-name" class="form-label">For Event DB Name</label>
                <select name="event-db-name" id="event-db-name" class="form-control">
                <option value="">Select DB</option>
                @foreach ($DBnames as $DBname)
                    <option value="{{ $DBname->dbname }}">{{ $DBname->dbname }}</option>
                @endforeach
                </select>
            </div>
            <div class="col-lg-12 mt-3">
                <div id="fb-editor"></div>
            </div>
            

        </form>
    </div><!-- /.box-body -->
</div><!--box-->
@endsection

@section('after-scripts')
<script src="{{ asset('js/forms/jqueryui/jquery-ui.min.js') }}"></script>
<script src="{{ asset('js/forms/form-builder/form-builder.min.js') }}"></script>
<script src="{{ asset('js/forms/form-builder/form-render.min.js') }}"></script>
<script src="{{ asset('js/sweetalert2/sweetalert2.all.min.js') }}"></script>
<script src="{{ asset('js/toastr/toastr.min.js') }}"></script>

<script src="{{ asset('js/forms/form.js') }}"></script>
<script src="{{ asset('js/forms/create-form.js') }}"></script>

@include('backend.form-manager.partials.alert_message')
@endsection