 <div class="row">      
        <div class="col-12">          
          <h2 class="h4">
         Subscription Request Form
          </h2>
          <hr>
        </div>
       <div class="col-12">

        @if ($errors->any())
        <div class="alert alert-danger">
        <ul>
          @foreach ($errors->all() as $error)
              <li>{{ $error }}</li>
          @endforeach
        </ul>
        </div>
        @endif

      @php 
        $first_name_value = '';
        $last_name_value = '';
        $user_category_value = '';
        $address_value = '';
        $city_value = '';
        $country_value = '';
        $state_value = '';
        $zip_value = '';
        $email_value = '';
        $phone_value = '';
        $fax_value = '';
      @endphp

        @if ($message = Session::get('success'))
            <div class="alert alert-success alert-dismissable">
                <p>{!! $message !!}</p>
            </div>
        @endif

    <div class="card">
      <div class="card-body">
      {{ Form::open(array('url' => 'subscribe-to-this-journal/'.$journal_id)) }}
          @csrf
        
          <h5 class="border-bottom pb-2 mb-4">
          Subscription Details:
          </h5>

          <div class="form-group">
              <label class="control-label" for="select21">Subscription Category: *</label>
              <select class="form-control select2" id="subs_category" name="subs_category" required>
                  <option selected="true" value="" disabled="disabled" hidden>--Please Select--</option>
                  @foreach($subs_category as $value)
                          <option value="{{ $value->subs_id }}" >{{ $value->subs_category }}</option>
                  @endforeach 
              </select>
          </div>

          <h5 class="border-bottom mt-5 pb-2 mb-4">Selected Options</h4>

          <div class="form-row">

           <div class="form-group col-md-12">
            <label>Subscription Type</label>
            <input type="text" name="subs_type" id="subs_type" class="form-control" readonly="readonly" value="{{ old('subs_type') }}" />
          </div>

        </div>

        <div class="form-row">

           <div class="form-group col-md-3">
            <label>Price</label>
            <input type="text" name="price" id="price" class="form-control" readonly="readonly" value="{{ old('price') }}" />
          </div>

           <div class="form-group col-md-3">
            <label>Volume</label>
            <input type="text" name="volume" id="volume" class="form-control" readonly="readonly" value="{{ old('volume') }}" />
          </div>       
       
           <div class="form-group col-md-3">
            <label>Frequency</label>
            <input type="text" name="frequency" id="frequency" class="form-control" readonly="readonly" value="{{ old('frequency') }}" />
          </div>
       
           <div class="form-group col-md-3">
            <label>Year</label>
            <input type="text" name="year" id="year" class="form-control" readonly="readonly" value="{{ old('year') }}" />
          </div>

        </div>

         <h5 class="border-bottom pb-2 mt-5 mb-4">Contact Information</h4>
          <div class="form-row">
           <div class="form-group col-md-4">
            <label>Title: *</label>
             <select class="form-control" id="salutation" name="salutation" required = 'required'>
                <option value="Mr." {{ (Request::old("salutation") == 'Mr.'? "selected":"") }}>Mr.</option>
                <option value="Mrs." {{ (Request::old("salutation") == 'Mrs.'? "selected":"") }}>Mrs.</option>
                <option value="Ms." {{ (Request::old("salutation") == 'Ms.'? "selected":"") }}>Ms.</option>
                <option value="Prof." {{ (Request::old("salutation") == 'Prof.'? "selected":"") }}>Prof.</option>
                <option value="Dr." {{ (Request::old("salutation") == 'Dr.'? "selected":"") }}>Dr.</option>
            </select>
          </div>
          <div class="form-group col-md-4">
            <label>First Name: *</label>
            @if(request('first_name'))
              @php $first_name_value = request('first_name'); @endphp
            @elseif($detail['first_name'])
              @php $first_name_value = $detail['first_name']; @endphp
            @endif
            <input type="text" name="first_name" class="form-control" required = 'required' value="{{$first_name_value}}" />
          </div>
          <div class="form-group col-md-4">
            <label>Last Name: *</label>
            @if(request('last_name'))
              @php $last_name_value = request('last_name'); @endphp
            @elseif($detail['last_name'])
              @php $last_name_value = $detail['last_name']; @endphp
            @endif
            <input type="text" name="last_name" class="form-control" required = 'required' value="{{$last_name_value}}" />
          </div>
        </div>
        <div class="form-row">
           <div class="form-group col-md-6">
            <label>User Category: *</label>

             <select class="form-control" id="user_category" name="user_category" required = 'required'>
                <option value="">--Please select--</option>
                <option value="Professor" @if($detail['user_category']=='Professor') selected @endif>Professor</option>
                <option value="Student" {{ (Request::old("user_category") == 'Student'? "selected":"") }}>Student</option>
                <option value="Researcher" {{ (Request::old("user_category") == 'Researcher'? "selected":"") }}>Researcher</option>
                <option value="Medical professional/Practitioner"  {{ (Request::old("user_category") == 'Medical professional/Practitioner'? "selected":"") }}>Medical professional/Practitioner</option>
                <option value="Other" {{ (Request::old("user_category") == 'Other'? "selected":"") }}>Other</option>
            </select>
          </div>
           <div class="form-group col-md-6">
            <label>Address: *</label>
            @if(request('address'))
              @php $address_value = request('address'); @endphp
            @elseif($detail['address'])
              @php $address_value = $detail['address']; @endphp
            @endif
            <textarea name="address" placeholder="Write something here..." class="form-control resize_vertical " data-autogrow="" rows="2" cols="80" required = 'required'>{{$address_value}}</textarea>
          </div>
        </div>
        <div class="form-row">
           <div class="form-group col-md-6">
            <label>City/Town: *</label>
            @if(request('city'))
              @php $city_value = request('city'); @endphp
            @elseif($detail['city'])
              @php $city_value = $detail['city']; @endphp
            @endif
            <input type="text" name="city" class="form-control" required = 'required' value="{{$city_value}}" />
          </div>                  
          <div class="form-group col-md-6">
            <label>State/Province:</label>
            @if(request('state'))
              @php $state_value = request('state'); @endphp
            @elseif($detail['state'])
              @php $state_value = $detail['state']; @endphp
            @endif
            <input type="text" name="state" class="form-control" value="{{$state_value}}" />
          </div>
        </div>
        <div class="form-row">
           <div class="form-group col-md-6">
            <label>Country: *</label>
            @if(request('country'))
              @php ($country_value = request('country')) @endphp
            @elseif($detail['country'])
              @php ($country_value = $detail['country']) @endphp
            @endif
             <select class="form-control select2" id="country" name="country" required = 'required'>
                <option value="">Country</option>
             @foreach ($country as $countries)
                <option value="{{$countries->iso}}" @if($country_value==$countries->iso) selected @endif> {{$countries->printable_name}}</option>
            @endforeach
             </select>
          </div>
           <div class="form-group col-md-6">
            <label>ZIP/Postal code:</label>
            @if(request('zip'))
              @php $zip_value = request('zip'); @endphp
            @elseif($detail['zip'])
              @php $zip_value = $detail['zip']; @endphp
            @endif
            <input type="text" name="zip" class="form-control" value="{{$zip_value}}"/>
        </div>
      </div>
        <div class="form-row">
           <div class="form-group col-md-4">
            <label>E-mail: *</label>
            @if(request('email'))
              @php $email_value = request('email'); @endphp
            @elseif($detail['email'])
              @php $email_value = $detail['email']; @endphp
            @endif
            <input type="email" name="email" class="form-control" required = 'required' value="{{$email_value}}"/>
          </div>
          <div class="form-group col-md-4">
            <label>Phone</label>
            @if(request('phone'))
              @php $phone_value = request('phone'); @endphp
            @elseif($detail['phone'])
              @php $phone_value = $detail['phone']; @endphp
            @endif
            <input type="text" name="phone" class="form-control" value="{{$phone_value}}" />
          </div>
          <div class="form-group col-md-4">

            <label>Fax:</label>
            @if(request('fax'))
              @php $fax_value = request('fax'); @endphp
            @elseif($detail['fax'])
              @php $fax_value = $detail['fax']; @endphp
            @endif
            <input type="text" name="fax" class="form-control" value="{{$fax_value}}"/>
          </div>
        </div>

        <div class="form-row">
          <div class="form-group col-md-6">
            <div class="form-group" id="validate_promocode">
              <label for="edit-promo-code">Promo Code:</label>  
              <input class="form-control" type="text" maxlength="128" id="promo_code" name="promo_code" size="60" class="form-text">
              <span id="promo_code_message"></span>
            </div>
          </div>
        </div>

          <div class="form-group text-center">                
              <div class="form-group row mt-3 w-100"> 
                                      <div class="col-auto mx-auto w-100 d-flex ">
                          <div class="col-md-6 text-right">
                              <div class="captcha">                                       
                                  <span>{!! captcha_img() !!}</span>             
                              </div>
                          </div>
                          <div class="col-md-6">                                        
                              <button type="button" class="btn btn-danger" class="refresh-captcha" id="refresh-captcha">
                                  &#x21bb;
                              </button> 
                          </div>
                      </div>
                      <div class="form-group my-2 mx-auto">
                          <input id="captcha" type="text" class="form-control" placeholder="Enter Captcha" name="captcha">
                          @if ($errors->has('captcha'))

                            <span class="invalid-feedback" style="display: block;">

                                <strong>{{ $errors->first('captcha') }}</strong>

                      </span>
                    @endif
                
          </div>              </div>                
          </div>

          <div class="form-group text-center border-top pt-3">
            <input class="btn btn-primary" id="subscription_request_form"  name="subscription_request_form" type="submit" value="Review" disabled="disabled">
          </div>
    {{ Form::close() }}   
      </div> 
</div>
  </div>
    </div>

<script>
$(document).ready(function()
{
$("html, body").animate({scrollTop: $("#printtopscroll").offset().top}, 200);
});

$( "#promo_code" ).keyup(function(e) 
{
    setTimeout( function(){response = validate_promo_code();}, 2000);
  
});

function validate_promo_code()
{
  var promo_code = $( "#promo_code" ).val();
  var response = 0;
  
  $.ajax({
        type: "POST",
    data: 
    {
      "_token": "{{ csrf_token() }}",
      "promo_code": promo_code,
      ajax: true
    },
        success: function (data) 
    { console.log(data);
      $( "#promo_code_message" ).html(data[1]);
      if(data[0])
      {
        $( "#validate_promocode" ).removeClass('alert alert-danger');
        $( "#validate_promocode" ).removeClass('alert alert-warning');
        $( "#validate_promocode" ).addClass('alert alert-success');
      }
      else
      {
        $( "#validate_promocode" ).removeClass('alert alert-success');
        $( "#validate_promocode" ).removeClass('alert alert-warning');
        $( "#validate_promocode" ).addClass('alert alert-danger');
      }
        },
    error: function () 
    { 
      $( "#validate_promocode" ).removeClass('alert alert-success');
      $( "#validate_promocode" ).removeClass('alert alert-warning');
      $( "#validate_promocode" ).addClass('alert alert-danger');
    },
    beforeSend: function () 
    {
      //console.log(data);
      $( "#validate_promocode" ).removeClass('alert alert-success');
      $( "#validate_promocode" ).removeClass('alert alert-danger');
      $( "#validate_promocode" ).addClass('alert alert-warning');
      
    }
       
    });    
   
}  
</script>
    