@extends('admin.layouts.main')

@section('container')
    <!-- dashboard inner -->
    <div class="midde_cont">
        <div class="container-fluid">
           <div class="row column_title">
              <div class="col-md-12">
                 <div class="page_title">
                    <h2>Dashboard Input Pertanyaan</h2>
                 </div>
              </div>
           </div>
        </div>
        
     </div>
     <!-- end dashboard inner -->
     <div class="container">
        <div class="row">
            <div class="col-md-12">
               <form method="post" action="/admin/pertanyaan" enctype="multipart/form-data">
                  @csrf

                     <!-- Pertanyaan input -->

                    <div class="form-outline mb-4 col-10" >
                     <label class="form-label" for="form4Example3">Pertanyaan</label>
                     <textarea class="form-control" id="tanya" name="tanya" rows="3"></textarea>
                     @error('tanya')
                        <p class="text-danger">
                           {{ $message }}
                        </p>
                     @enderror
                    </div>

                    <!-- Nilai input -->
                    <div class="form-outline mb-4 col-6">
                        <label class="form-label" for="form4Example2">Nilai</label>
                        <input type="text" name="nilai" id="nilai" class="form-control @error('nilai') is-invalid @enderror" required/>
                        @error('nilai')
                        <div class="invalid-feedback">
                           {{ $message }}
                        </div>
                        @enderror
                    </div>

                    <!-- Email input -->
                    <div class="form-outline mb-4 col-2">
                        <button type="submit" class="btn btn-info btn-block mb-4">Simpan</button>
                    </div>
                  
                  
                    <!-- Submit button -->
                    
               </form>
            </div>
        </div>
     </div>
     <script>
      const title = document.querySelector("#judul");
      const slug = document.querySelector("#slug");

      title.addEventListener("keyup", function() {
          let preslug = judul.value;
          preslug = preslug.replace(/ /g,"-");
          slug.value = preslug.toLowerCase();
      });
     </script>
@endsection