@extends('layouts.app')

@section('content')
<div class="container">
    <div class="form-container">
        <form action="{{ route('questions.update', ['ukey' => $question->ukey]) }}" method="POST" enctype="multipart/form-data">
            @csrf

            <input type='hidden' name='id' value='{{ $question->id }}' />

            <div  class="columns" style='border-bottom:1px solid #ccc'>
                    <div class="column is-4">
                          <img src='{{ $question->url }}' width='100%' />
                          @if(!empty($question->url2))
                            <p><img src="{{ $question->url2 }}" width="100%" /></p>
                          @endif

                    </div>
                    <div class="column is-4">
                        <div> Question ID: {{$question->id}} </div>
                        <div> Correct Answer : {{$question->answer}} </div>
                        <div> <b>{{ optional($question->section)->name }}</b> </div>
<div> {{ optional($question->subsection)->name }} </div>

                          
                    </div>
                    <div class="column is-4">
                    <div class="field">
                        <label class="label" for="answer">Answer:</label>
                        <div class="control">
                            <input type="text" class="input" name="answer" value="{{ $question->answer }}">
                        </div>
                    </div>

                    <div class="field">
                        <label class="label" for="answer">Order Number:</label>
                        <div class="control">
                        <input type='text' class="input" name='number' value='{{$question->number}}' /> 
                        </div>
                    </div>

                
                    <div class="field">
                        <label class="label" for="section_id">Section:</label>
                        <div class="control">
                            <div class="select">
                            <select name="section_id" id="section_id">
                                @foreach($sections as $section)
                                    <option value="{{ $section->id }}" 
                                        {{ $question->section_id == $section->id ? 'selected' : '' }}>
                                        {{ $section->name }}
                                    </option>
                                @endforeach
                            </select>
                            </div>
                        </div>
                    </div>
                    
                    <div class="field">
                        <label class="label" for="subsection_id">Subsection:</label>
                        <div class="control">
                            <div class="select">
                                <select name="subsection_id" id="subsection_id">
                                    @foreach($subsections as $subsection)
                                        <option value="{{ $subsection->id }}"  {{ $question->subsection_id == $subsection->id ? 'selected' : '' }}>{{ $subsection->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    </div>
                    
                    <div class="field">
                        <div class="control">
                            <button class="button is-primary" type="submit">Update Question</button>
                        </div>
                    </div>
               

                    <input type="hidden" name="question_ids[]" value="{{ $question->id }}"  >     
                    </div>
                </div>  
       



            
        </form>
    </div>
</div>
@endsection