{{ layout "simple_layout.html" }}
{{ $context := . }}
{{ $details := .ShippingDetails }}

<div class="p-2">
    <h2>Check out now</h2>
    Please enter you details,and we'll ship your goods right away!
</div>

{{ if gt (len $context.ValidationErrors) 0 }}
<ul class="text-danger mt-3">
    {{ range $context.ValidationErrors }}
    <li>{{ index . 0 }}: {{ index . 1 }}</li>
    {{ end }}
</ul>
{{ end }}

<form method="POST" class="p-2">
    <h3>Ship to</h3>
    <div class="form-group">
        <label for="name">Name:</label>
        <input type="text" class="form-control" id="name" name="name" value="{{ $details.Name }}"/>
    </div>
    <div class="form-group">
        <label for="StreetAddr">Street Address:</label>
        <input type="text" class="form-control" id="StreetAddr" name="StreetAddr" value="{{ $details.StreetAddr }}"/>
    </div>
    <div class="form-group">
        <label for="city">City:</label>
        <input type="text" class="form-control" id="city" name="city" value="{{ $details.City }}"/>
    </div>
    <div class="form-group">
        <label for="state">State:</label>
        <input type="text" class="form-control" id="state" name="state" value="{{ $details.State }}"/>
    </div>
    <div class="form-group">
        <label for="zip">Zip Code:</label>
        <input type="text" class="form-control" id="zip" name="zip" value="{{ $details.Zip }}"/>
    </div>
    <div class="form-group">
        <label for="country">Country:</label>
        <input type="text" class="form-control" id="country" name="country" value="{{ $details.Country }}"/>
    </div>
    <div class="text-center py-1">
        <button class="btn btn-primary m-1" type="submit">Submit</button>
        <a class="btn btn-secondary m-1" href="{{ $context.CancelUrl }}">cancel</a>
    </div>
</form>