@extends('layouts.app')
@section('content')
  <div class="main-content">
    <!-- Header -->
    <div class="header bg-gradient-danger pb-8 pt-5 pt-md-6">
        <div class="container-fluid">
          <div class="header-body">
            <div class="row align-items-center py-4">
                <div class="col-lg-6 col-7">
                    <nav aria-label="breadcrumb" class="d-none d-md-inline-block ml-md-4">
                        <ol class="breadcrumb breadcrumb-links breadcrumb-dark">
                          <li class="breadcrumb-item"><a href="{{url('user/home')}}"><i class="fas fa-home"></i></a></li>
                          <li class="breadcrumb-item"><a href="{{url('addressbook')}}">Address Book</a></li>
                          <li class="breadcrumb-item active" aria-current="page">Edit</li>
                        </ol>
                    </nav>
                </div>
            
            </div>
          </div>
      </div>
    </div>
    <!-- Page content -->
    <div class="container-fluid mt--7">
        <div class="row">
          <div class="col-lg-12">
              <div class="card bg-secondary shadow">
                <div class="card-header bg-white">
                  <div class="row align-items-center">
                    <div class="col-12">
                      <h4 class="mb-0">Edit Address Book</h4>
                    </div>
                  </div>
                </div>
                <div class="card-body">
                    <form method="POST" name="myform" id="myform" action="{{ url('addressbook/edit') }}" enctype="multipart/form-data">
                        {{ csrf_field() }}
                        
                        @if(Session::has('message'))
                        <div class="alert {{ Session::get('alert-class', 'alert-info') }}" role="alert">
                            {{ Session::get('message') }}
                        </div>
                        @endif
                        <div class="card-body">  
                             <div class="container">
                               <div class="row">
                                <div class="col-sm">
                                    <div class="card-body" style="background: #ffffff;">
                                        <div class="form-group">
                                          <input type="hidden" name="id" id="id" value="{{$addressbook->id}}">
                                          <input type="hidden" name="user_id" id="user_id" value="{{$addressbook->user_id}}">
                                            <label for="concept" class="control-label">Name</label>
                                            <input type="text" class="form-control" id="name_id" name="name" placeholder="Name" value="{{$addressbook->name}}"  required>
                                        </div>
                                        <div class="form-group">
                                            <label for="zip_code" class="control-label">Zip Code</label>
                                            <input type="number" class="form-control" id="zip_code_id" name="zip_code" value="{{$addressbook->zip_code}}" placeholder="Zip Code" min="0"  required>
                                        </div>
                                        <div class="form-group">
                                            <label for="address" class="control-label">Address</label>
                                            <textarea name="address" id="address_id" class="form-control"  placeholder="Address"/>{{$addressbook->address}}</textarea>
                                        </div> 
                                        <div class="form-group">
                                            <label for="unit_number" class="control-label">Unit Number</label>
                                            <input type="text" class="form-control" name="unit_number" id="unit_id" placeholder="Unit Number" value="{{$addressbook->unit_number}}"  required>
                                        </div>
                                        
                                        <div class="form-group">
                                            <label for="status" class="control-label">Phone Number</label>
                                            <input type="text" class="form-control" id="phone_number_id" name="phone_number" placeholder="Phone Number" value="{{$addressbook->phone_number}}" required>
                                        </div>
                                        <div class="form-group">
                                            <label for="status" class="control-label">Property</label>
                                            <input type="text" class="form-control" id="property_id" name="property" placeholder="Property" value="{{$addressbook->property}}" required>
                                        </div>
                                      </div>
                                    </div>
                                </h5><br/>
                              </div>
                            </div>
                          </div>
                        </div>
                            <br/>
                            <div align="center"><input type="submit" name="submit" value="Update" class="btn btn-primary">&nbsp;</div>    

                        </div>
                    </form>    
                </div>
              </div>
          </div>
        </div>
    </div>
    <style>
input { font-size: 13px !important; }
label { font-size: 13px !important; }
select { font-size: 13px !important; height: 40px !important; }
text { height: 35px !important; }
.opt { height: auto !important; }
.form-group{ margin-bottom: 5px !important; }
.noborder td{ border: none; }
</style>
<script type="text/javascript">
$(document).ready( function () {

    //load sender address based on zip code
    zip_code_id = $('#zip_code_id').val();
    load_address(zip_code_id);
    $('#zip_code_id').on('change', function(){
        zip_code_id = $(this).val();
        load_address(zip_code_id); 

      });

    function load_address(zip_code_id){
        $.ajax({
            method: "GET",
            url: "{{URL::to('user/ajax/address')}}/" + zip_code_id,
        }).done(function(data) {
          $('#address_id').html('');
          $.each(data, function(id,value) {
            var address =value.building_name+''+value.street_number+''+value.street_name+' '+value.building_type;
            var property =value.building_type;
            $('#address_id').val(address);
            $('#property_id').val(property);
          });
          return true;
        });
    }
  });

</script>

@endsection