@extends('layouts.app')

@section('content')
@php
  $my_hospital = \App\Models\Hospital::find(\Auth::user()->hospital_id);
@endphp
<div class="container">
  <div class="row">
    <div class="col-md-12">
       <div class="card">
        <div class="card-body pt-2">
          <div class="text-center">
            <h2 class="text-gray-900 mb-4 sub-title">เพิ่มผู้ป่วยรายใหม่</h2>
          </div>
          <form class="user" action="{{ route('frontend.patient.save') }}" method="post">
            @csrf
            <input type="hidden" name="id" value="0">
            <input type="hidden" name="hospital_id" value="{{$my_hospital->id}}">
            <div class="row justify-content-md-center mt-3">
              @if ($errors->any())
                <div class="col-md-10 mt-3">
                  <div class="alert alert-danger bg-gradient-danger">
                    <ul style="list-style: none;margin-bottom: 0;color: #fff;">
                        @foreach ($errors->all() as $error)
                          <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                  </div>
                </div>
              @endif
              <div class="col-md-10 mt-2">
                <div class="has-float-label">
                  <input type="text" name="case_id" id="case_id" class="form-control form-control-user" value="{{ old('case_id') }}" placeholder="Case id" required>
                  <label for="case_id">Case ID</label>
                  {!! $errors->first('case_id', '<p class="help-block text-danger mb-0">:message</p>') !!}
                </div>
              </div>
              <div class="col-md-10 mt-2">
                <div class="has-float-label">
                  <input type="text" name="fullname" id="fullname" class="form-control form-control-user" value="{{ old('fullname') }}" placeholder="ชื่อ-สกุล" required>
                  <label for="fullname">ชื่อ-สกุล</label>
                  {!! $errors->first('fullname', '<p class="help-block text-danger mb-0">:message</p>') !!}
                </div>
              </div>

              <div class="col-md-10 mt-2">
                <div class="row justify-content-md-center">
                  <div class="col-md-6 mt-2">
                    <div class="has-float-label">
                      <input type="number" name="age" id="age" class="form-control form-control-user" value="{{ old('age') }}" placeholder="อายุ" required>
                      <label for="age">อายุ</label>
                      {!! $errors->first('age', '<p class="help-block text-danger mb-0">:message</p>') !!}
                    </div>
                  </div>
                 <div class="col-md-6 mt-2">
                    <div class="has-float-label">
                      <select class="form-control" name="sex" id="sex" required placeholder="เพศ">
                        <option value="male">ชาย</option>
                        <option value="female">หญิง</option>
                      </select>
                      <label for="sex">เพศ</label>
                      {!! $errors->first('sex', '<p class="help-block text-danger mb-0">:message</p>') !!}
                    </div>
                  </div>
                </div>
              </div>

              <div class="col-md-10 mt-2">
                <div class="has-float-label">
                  <input type="text" name="identification_number" id="identification_number" class="form-control form-control-user" value="{{ old('identification_number') }}" placeholder="เลขประจำตัวประชาชน" required>
                  <label for="identification_number">เลขประจำตัวประชาชน</label>
                  {!! $errors->first('identification_number', '<p class="help-block text-danger mb-0">:message</p>') !!}
                </div>
              </div>

              <div class="col-md-10 mt-2">
                <div class="has-float-label">
                  <input type="text" name="nationality" id="nationality" class="form-control form-control-user" value="{{ old('nationality') }}" placeholder="สัญชาติ" required>
                  <label for="nationality">สัญชาติ</label>
                  {!! $errors->first('nationality', '<p class="help-block text-danger mb-0">:message</p>') !!}
                </div>
              </div>

              <div class="col-md-10 mt-2">
                <div class="has-float-label">
                  <input type="text" name="career" id="career" class="form-control form-control-user" value="{{ old('career') }}" placeholder="อาชีพ" required>
                  <label for="career">อาชีพ</label>
                  {!! $errors->first('career', '<p class="help-block text-danger mb-0">:message</p>') !!}
                </div>
              </div>

              <div class="col-md-10 mt-2">
                <div class="has-float-label">
                  <input type="tel" name="phone" id="phone" class="form-control form-control-user" value="{{ old('phone') }}" placeholder="โทรศัพท์" required>
                  <label for="phone">โทรศัพท์</label>
                  {!! $errors->first('phone', '<p class="help-block text-danger mb-0">:message</p>') !!}
                </div>
              </div>
              
              <div class="col-md-10 mt-4">
                <div class="row justify-content-md-center">
                  <div class="col-md-12">
                    <h4 class="sub-title">ที่อยู่ขณะเจ็บป่วย</h4>
                  </div>
                  <div class="col-6 mt-2 mt-3">
                    <div class="has-float-label">
                      <input type="text" name="address_number" id="address_number" class="form-control form-control-user" value="{{ old('address_number') }}" placeholder="เลขที่" required>
                      <label for="address_number">เลขที่</label>
                      {!! $errors->first('address_number', '<p class="help-block text-danger mb-0">:message</p>') !!}
                    </div>
                  </div>

                  <div class="col-6 mt-3">
                    <div class="has-float-label">
                      <input type="text" name="moo" id="moo" class="form-control form-control-user" value="{{ old('moo') }}" placeholder="หมู่ที่" required>
                      <label for="moo">หมู่ที่</label>
                      {!! $errors->first('moo', '<p class="help-block text-danger mb-0">:message</p>') !!}
                    </div>
                  </div>
                    <div class="col-6 mt-2">
                      <div class="has-float-label">
                        <select class="form-control select2" name="PROVINCE_ID" id="province" required>
                          <option></option>
                          @php
                             $provinces = \App\Models\Province::all();
                          @endphp
                          @foreach($provinces as $key => $province)
                          <option @if($my_hospital->PROVINCE_ID == $province->PROVINCE_ID) selected @endif value="{{$province->PROVINCE_ID}}">{{$province->PROVINCE_NAME}}</option>
                          @endforeach
                        </select>
                        <label for="province">จังหวัด</label>
                      </div>
                    </div>
                    <div class="col-6 mt-2">
                      <div class="has-float-label">
                        <input type="hidden" id="my_amphur" value="{{$my_hospital->AMPHUR_ID}}">
                        <select class="form-control select2" name="AMPHUR_ID" id="amphur" required>
                          <option></option>
                          {{-- @php
                             $amphurs = \App\Models\Amphur::all();
                          @endphp
                          @foreach($amphurs as $key => $amphur)
                          <option @if($my_hospital->AMPHUR_ID == $amphur->AMPHUR_ID) selected @endif value="{{$amphur->AMPHUR_ID}}">{{$amphur->AMPHUR_NAME}}</option>
                          @endforeach --}}
                        </select>
                        <label for="my_amphur">อำเภอ</label>
                      </div>
                    </div>
                    <div class="col-6 mt-2">
                      <div class="has-float-label">
                        <input type="hidden" id="my_sub_district" value="{{$my_hospital->DISTRICT_ID}}">
                        <select class="form-control select2" name="DISTRICT_ID" id="sub_district" required>
                          <option></option>
                          {{-- @php
                             $sub_district = \App\Models\SubDistrict::all();
                          @endphp
                          @foreach($sub_district as $key => $district)
                          <option @if($my_hospital->DISTRICT_ID == $district->DISTRICT_ID) selected @endif value="{{$district->DISTRICT_ID}}">{{$district->DISTRICT_NAME}}</option>
                          @endforeach --}}
                        </select>
                        <label for="my_sub_district">ตำบล</label>
                      </div>
                    </div>
                  </div> 
              </div>

              <div class="col-md-10 mt-4">
                <h4 class="sub-title">อาการและอาการแสดง</h4>
                <div class="has-float-label mt-3">
                  <input type="text" class="form-control datepicker" autocomplete="off" id="date_symptom" name="date_symptom" placeholder="01-01-2021" data-date-format="dd-mm-yyyy">
                  <label for="date_symptom">วันที่อาการแสดง</label>
                </div>
              </div>
              <div class="col-md-10 mt-3">
                <div class="border p-3">
                  
                <div class="row">
                  <div class="col-md-6 col-sm-5 col-xs-5">
                    ไข้/ไข้สูงเฉียบพลัน
                  </div>
                  <div class="col-md-6 col-sm-7 col-xs-7">
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[1]" id="symptom_1-1" value="1">
                      <label class="form-check-label" for="symptom_1-1">มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[1]" id="symptom_1-2" value="2">
                      <label class="form-check-label" for="symptom_1-2">ไม่มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[1]" id="symptom_1-3" value="3">
                      <label class="form-check-label" for="symptom_1-3">ไม่ทราบ</label>
                    </div>
                  </div>

                  <div class="col-md-6 col-sm-5 col-xs-5">
                    ปวดศีรษะ
                  </div>
                  <div class="col-md-6 col-sm-7 col-xs-7">
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[2]" id="symptom_2-1" value="1">
                      <label class="form-check-label" for="symptom_2-1">มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[2]" id="symptom_2-2" value="2">
                      <label class="form-check-label" for="symptom_2-2">ไม่มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[2]" id="symptom_2-3" value="3">
                      <label class="form-check-label" for="symptom_2-3">ไม่ทราบ</label>
                    </div>
                  </div>

                  <div class="col-md-6 col-sm-5 col-xs-5">
                    ปวดกระบอกตา
                  </div>
                  <div class="col-md-6 col-sm-7 col-xs-7">
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[3]" id="symptom_3-1" value="1">
                      <label class="form-check-label" for="symptom_3-1">มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[3]" id="symptom_3-2" value="2">
                      <label class="form-check-label" for="symptom_3-2">ไม่มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[3]" id="symptom_3-3" value="3">
                      <label class="form-check-label" for="symptom_3-3">ไม่ทราบ</label>
                    </div>
                  </div>

                  <div class="col-md-6 col-sm-5 col-xs-5">
                    ปวดกล้ามเนื้อ
                  </div>
                  <div class="col-md-6 col-sm-7 col-xs-7">
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[4]" id="symptom_4-1" value="1">
                      <label class="form-check-label" for="symptom_4-1">มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[4]" id="symptom_4-2" value="2">
                      <label class="form-check-label" for="symptom_4-2">ไม่มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[4]" id="symptom_4-3" value="3">
                      <label class="form-check-label" for="symptom_4-3">ไม่ทราบ</label>
                    </div>
                  </div>

                  <div class="col-md-6 col-sm-5 col-xs-5">
                    ปวดกระดูก/ข้อต่อ
                  </div>
                  <div class="col-md-6 col-sm-7 col-xs-7">
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[5]" id="symptom_5-1" value="1">
                      <label class="form-check-label" for="symptom_5-1">มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[5]" id="symptom_5-2" value="2">
                      <label class="form-check-label" for="symptom_5-2">ไม่มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[5]" id="symptom_5-3" value="3">
                      <label class="form-check-label" for="symptom_5-3">ไม่ทราบ</label>
                    </div>
                  </div>

                  <div class="col-md-6 col-sm-5 col-xs-5">
                    ผื่นแดง
                  </div>
                  <div class="col-md-6 col-sm-7 col-xs-7">
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[6]" id="symptom_6-1" value="1">
                      <label class="form-check-label" for="symptom_6-1">มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[6]" id="symptom_6-2" value="2">
                      <label class="form-check-label" for="symptom_6-2">ไม่มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[6]" id="symptom_6-3" value="3">
                      <label class="form-check-label" for="symptom_6-3">ไม่ทราบ</label>
                    </div>
                  </div>

                  <div class="col-md-6 col-sm-5 col-xs-5">
                    มีเลือดออกตามผิดหนัง
                  </div>
                  <div class="col-md-6 col-sm-7 col-xs-7">
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[7]" id="symptom_7-1" value="1">
                      <label class="form-check-label" for="symptom_7-1">มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[7]" id="symptom_7-2" value="2">
                      <label class="form-check-label" for="symptom_7-2">ไม่มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[7]" id="symptom_7-3" value="3">
                      <label class="form-check-label" for="symptom_7-3">ไม่ทราบ</label>
                    </div>
                  </div>

                  <div class="col-md-6 col-sm-5 col-xs-5">
                    มีเลือดออกทางอวัยวะภายใน
                  </div>
                  <div class="col-md-6 col-sm-7 col-xs-7">
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[8]" id="symptom_8-1" value="1">
                      <label class="form-check-label" for="symptom_8-1">มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[8]" id="symptom_8-2" value="2">
                      <label class="form-check-label" for="symptom_8-2">ไม่มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[8]" id="symptom_8-3" value="3">
                      <label class="form-check-label" for="symptom_8-3">ไม่ทราบ</label>
                    </div>
                  </div>

                  <div class="col-md-6 col-sm-5 col-xs-5">
                    ตับโต (มักกดเจ็บ)
                  </div>
                  <div class="col-md-6 col-sm-7 col-xs-7">
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[9]" id="symptom_9-1" value="1">
                      <label class="form-check-label" for="symptom_9-1">มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[9]" id="symptom_9-2" value="2">
                      <label class="form-check-label" for="symptom_9-2">ไม่มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[9]" id="symptom_9-3" value="3">
                      <label class="form-check-label" for="symptom_9-3">ไม่ทราบ</label>
                    </div>
                  </div>

                  <div class="col-md-6 col-sm-5 col-xs-5">
                    มีภาวะช็อก
                  </div>
                  <div class="col-md-6 col-sm-7 col-xs-7">
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[10]" id="symptom_10-1" value="1">
                      <label class="form-check-label" for="symptom_10-1">มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[10]" id="symptom_10-2" value="2">
                      <label class="form-check-label" for="symptom_10-2">ไม่มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[10]" id="symptom_10-3" value="3">
                      <label class="form-check-label" for="symptom_10-3">ไม่ทราบ</label>
                    </div>
                  </div>

                  <div class="col-md-6 col-sm-5 col-xs-5">
                    Tourniquet test
                  </div>
                  <div class="col-md-6 col-sm-7 col-xs-7">
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[11]" id="symptom_11-1" value="1">
                      <label class="form-check-label" for="symptom_11-1">มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[11]" id="symptom_11-2" value="2">
                      <label class="form-check-label" for="symptom_11-2">ไม่มี</label>
                    </div>
                    <div class="form-check form-check-inline">
                      <input class="form-check-input" type="radio" name="symptom[11]" id="symptom_11-3" value="3">
                      <label class="form-check-label" for="symptom_11-3">ไม่ทราบ</label>
                    </div>
                  </div>
                </div>
                </div>
              </div>
              <div class="col-md-10 mt-4">
                <div class="row">
                  <div class="col-md-12">
                    <h4 class="sub-title">ข้อมูลเกี่ยวกับการวินิจฉัยโรค</h4>
                  </div>
                  <div class="col-md-6 mt-3">
                    <div class="has-float-label">
                      <input type="text" name="date_sick" id="date_sick" class="form-control datepicker" autocomplete="off" value="{{ old('date_sick') }}" placeholder="วันที่เริ่มป่วย" data-date-format="dd-mm-yyyy">
                      <label for="date_sick">วันที่เริ่มป่วย</label>
                    </div>
                  </div>
                  <div class="col-md-6 mt-3">
                    <div class="has-float-label">
                      <input type="text" name="date_dx" id="date_dx" class="form-control datepicker" autocomplete="off" value="{{ old('date_dx') }}" placeholder="วันที่วินิจฉัย" data-date-format="dd-mm-yyyy">
                      <label for="date_dx">วันที่วินิจฉัย</label>
                    </div>
                  </div>
                  <div class="col-md-12 mt-3">
                    <div class="has-float-label">
                      {{-- <input type="text" name="dx" id="dx" class="form-control" value="{{ old('dx') }}" placeholder="โรคที่วินิจฉัย" > --}}
                      <select class="form-control" name="dx" id="dx" placeholder="โรคที่วินิจฉัย">
                        <option value="DF">DF</option>
                        <option value="DHF">DHF</option>
                        <option value="DSS">DSS</option>
                        <option value="ไม่ระบุ">ไม่ระบุ</option>
                      </select>
                      <label for="dx">โรคที่วินิจฉัย</label>
                    </div>
                  </div>
                </div>
              </div>

              <div class="col-md-10 mt-4">
                <div class="row">
                  <div class="col-md-12">
                    <h4 class="sub-title">ผลทางห้องปฏิบัติการ</h4>
                    <div class="has-float-label mt-3">
                      <input type="text" class="form-control datepicker" autocomplete="off" id="date_lab" name="date_lab" placeholder="Lab Date" data-date-format="dd-mm-yyyy" required>
                      <label for="date_lab">Lab Date</label>
                    </div>
                  </div>
                  <div class="col-md-6 mt-3">
                    <div class="has-float-label">
                    <input type="text" name="lab_wbc" id="lab_wbc" class="form-control" value="{{ old('lab_wbc') }}" placeholder="WBC">
                      <label for="lab_wbc">WBC</label>
                    </div>
                  </div>
                  <div class="col-md-6 mt-3">
                    <div class="has-float-label">
                    <input type="text" name="lab_pit" id="lab_pit" class="form-control" value="{{ old('lab_pit') }}" placeholder="Pit" >
                      <label for="lab_pit">Pit</label>
                    </div>
                  </div>
                  <div class="col-md-6 mt-3">
                    <div class="has-float-label">
                    <input type="text" name="lab_hct" id="label" class="form-control" value="{{ old('lab_hct') }}" placeholder="Hct" >
                      <label for="label">Hct</label>
                    </div>
                  </div>
                  <div class="col-md-6 mt-3">
                    <div class="has-float-label">
                    <input type="text" name="lab_neu" id="lab_neu" class="form-control" value="{{ old('lab_neu') }}" placeholder="Neu" >
                      <label for="lab_neu">Neu</label>
                    </div>
                  </div>
                  <div class="col-md-6 mt-3">
                    <div class="has-float-label">
                    <input type="text" name="lab_lym" id="lab_lym" class="form-control" value="{{ old('lab_lym') }}" placeholder="Lym" >
                      <label for="lab_lym">Lym</label>
                    </div>
                  </div>
                  <div class="col-md-12 mt-3">
                    <div class="has-float-label">
                      <select class="form-control" name="lab_status" id="lab_status" placeholder="สถานะ">
                        <option value="กำลังรักษา">กำลังรักษา</option>
                        <option value="หาย">หาย</option>
                        <option value="เสียชีวิต">เสียชีวิต</option>
                        <option value="ไม่สมัครใจ">ไม่สมัครใจ</option>
                        <option value="ย้าย รพ.">ย้าย รพ.</option>
                      </select>
                      <label for="lab_status">สถานะ</label>
                    </div>
                  </div>
                </div>
              </div>
              
              <div class="col-md-10 mt-3">
                @php
                   $hospital = \App\Models\Hospital::find($my_hospital->id);
                @endphp
                <div class="has-float-label">
                  <div class="has-float-label">
                    <input type="text" class="form-control" name="" id="hospital_name" value="{{$hospital->name}}" readonly>
                    <label for="hospital_name">โรงพยาบาล</label>
                  </div>
                </div>
              </div>

              {{-- <div class="col-md-10 mt-3">
                <div class="has-float-label">
                  <div class="has-float-label">
                    <select class="form-control select2" name="hospital_id" id="hospitals-select" required placeholder="โรงพยาบาล">
                      <option></option>
                      @php
                         $hospitals = \App\Models\Hospital::all();
                      @endphp
                      @foreach($hospitals as $key => $hospital)
                      <option @if($my_hospital->id == $hospital->id) selected @endif value="{{$hospital->id}}">{{$hospital->name}}</option>
                      @endforeach
                    </select>
                    <label for="hospitals-select">โรงพยาบาล</label>
                  </div>
                </div>
              </div> --}}

               <div class="col-md-8 text-center mt-5">
                  <button type="submit" class="btn btn-primary btn-user btn-block">บันทึก</button>
              </div>
               <div class="col-md-8 text-center mt-2 hidden">
                  <input type="hidden" name="next" value="0">
                  <button type="button" class="btn btn-primary btn-user" onclick="nextStep()">บันทึกและไปยังรายงานการสอบสวนโรค</button>
              </div>
            </div>    
                 
            <div class="clearfix"></div>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>
@endsection

@section('styles')

@endsection

@section('scripts')
<script type="text/javascript">
      $('#sub_district.select2').select2({
            placeholder: "ตำบล",
            allowClear: true
      });
      $('#amphur.select2').select2({
            placeholder: "อำเภอ",
            allowClear: true
      });
      $('#province.select2').select2({
            placeholder: "จังหวัด",
            allowClear: true
      });
      $('#hospitals-select.select2').select2({
            placeholder: "โรงพยาบาล",
            allowClear: true
      });

      $('#province').change(function(){
          getAmphur(jQuery('#province').val());
      });
      $('#amphur').change(function(){
          getSubDistrict(jQuery('#province').val(), jQuery('#amphur').val());
      });

      $(function(){
        getAmphur(jQuery('#province').val());
      });
      function getAmphur(province){
        $.ajax({
          url: '{{ route('frontend.get-amphur') }}',
          type: 'post',
          dataType: 'json',
          data: {
            _token: '{{ csrf_token() }}',
            province: province
          },
          success: function(res){
            if(res.data != ''){
                var html = '<option value="">All amphur</option>';
                $.each( res.data, function( i, val ) {
                    if(jQuery('#my_amphur').val() == val.AMPHUR_ID){
                      html += '<option selected value="'+val.AMPHUR_ID+'">'+val.AMPHUR_NAME+'</option>';
                    }else{
                      html += '<option value="'+val.AMPHUR_ID+'">'+val.AMPHUR_NAME+'</option>';
                    }
                });
                $('#amphur').html(html);
            }else{
              $('#amphur').html('<option value="">All sub district</option>');
            }
            
            getSubDistrict(province,'');
          }
        });
      }

      function getSubDistrict(province,amphur){
        $.ajax({
          url: '{{ route('frontend.get-sub-district') }}',
          type: 'post',
          dataType: 'json',
          data: {
            _token: '{{ csrf_token() }}',
            province: province,
            amphur: amphur
          },
          success: function(res){
            if(res.data != ''){
                var html = '<option value="">All sub district</option>';
                $.each( res.data, function( i, val ) {
                    if(jQuery('#my_sub_district').val() == val.DISTRICT_ID){
                      html += '<option selected value="'+val.DISTRICT_ID+'">'+val.DISTRICT_NAME+'</option>';
                    }else{
                      html += '<option value="'+val.DISTRICT_ID+'">'+val.DISTRICT_NAME+'</option>';
                    }
                });
                $('#sub_district').html(html);
            }else{
              $('#sub_district').html('<option value="">All sub district</option>');
            }
          }
        });
      }

      function nextStep(){
        $('input[name="next"]').val(1);
        $('input[type="submit"]').trigger('click');
      }
</script>
@endsection