@extends('layouts.app')

@section('content')
<div class="container">
    <h2 class="mb-4">Editar Formulario</h2>

    <form action="{{ route('form-templates.update', $formTemplate->id) }}" method="POST" onsubmit="return saveForm()" class="form-base">
        @csrf
        @method('PUT')

        <div class="mb-3">
            <label for="form_name" class="form-label">Nombre del Formulario</label>
            <input type="text" name="form_name" class="form-control" value="{{ $formTemplate->name ?? '' }}" required>

        </div>

        <div id="fb-editor" class="mb-3"></div>

        <!-- Campo oculto para guardar el JSON -->
        <input type="hidden" name="schema" id="formSchema">

        <button type="submit" class="btn btn-primary">Actualizar Formulario</button>
    </form>

    <!-- Librerías necesarias -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js"></script>
  <script src="https://formbuilder.online/assets/js/form-builder.min.js"></script>

<script src="https://formbuilder.online/assets/js/form-render.min.js"></script>

    <script>
  jQuery(function($) {
    $(document.getElementById('fb-editor')).formBuilder();
  });
  </script>
</div>
@endsection