guest_shipping.twig (17319B)
1 <form class="form-horizontal"> 2 <div class="form-group required"> 3 <label class="col-sm-2 control-label" for="input-shipping-firstname">{{ entry_firstname }}</label> 4 <div class="col-sm-10"> 5 <input type="text" name="firstname" value="{{ firstname }}" placeholder="{{ entry_firstname }}" id="input-shipping-firstname" class="form-control" /> 6 </div> 7 </div> 8 <div class="form-group required"> 9 <label class="col-sm-2 control-label" for="input-shipping-lastname">{{ entry_lastname }}</label> 10 <div class="col-sm-10"> 11 <input type="text" name="lastname" value="{{ lastname }}" placeholder="{{ entry_lastname }}" id="input-shipping-lastname" class="form-control" /> 12 </div> 13 </div> 14 <div class="form-group"> 15 <label class="col-sm-2 control-label" for="input-shipping-company">{{ entry_company }}</label> 16 <div class="col-sm-10"> 17 <input type="text" name="company" value="{{ company }}" placeholder="{{ entry_company }}" id="input-shipping-company" class="form-control" /> 18 </div> 19 </div> 20 <div class="form-group required"> 21 <label class="col-sm-2 control-label" for="input-shipping-address-1">{{ entry_address_1 }}</label> 22 <div class="col-sm-10"> 23 <input type="text" name="address_1" value="{{ address_1 }}" placeholder="{{ entry_address_1 }}" id="input-shipping-address-1" class="form-control" /> 24 </div> 25 </div> 26 <div class="form-group"> 27 <label class="col-sm-2 control-label" for="input-shipping-address-2">{{ entry_address_2 }}</label> 28 <div class="col-sm-10"> 29 <input type="text" name="address_2" value="{{ address_2 }}" placeholder="{{ entry_address_2 }}" id="input-shipping-address-2" class="form-control" /> 30 </div> 31 </div> 32 <div class="form-group required"> 33 <label class="col-sm-2 control-label" for="input-shipping-city">{{ entry_city }}</label> 34 <div class="col-sm-10"> 35 <input type="text" name="city" value="{{ city }}" placeholder="{{ entry_city }}" id="input-shipping-city" class="form-control" /> 36 </div> 37 </div> 38 <div class="form-group required"> 39 <label class="col-sm-2 control-label" for="input-shipping-postcode">{{ entry_postcode }}</label> 40 <div class="col-sm-10"> 41 <input type="text" name="postcode" value="{{ postcode }}" placeholder="{{ entry_postcode }}" id="input-shipping-postcode" class="form-control" /> 42 </div> 43 </div> 44 <div class="form-group required"> 45 <label class="col-sm-2 control-label" for="input-shipping-country">{{ entry_country }}</label> 46 <div class="col-sm-10"> 47 <select name="country_id" id="input-shipping-country" class="form-control"> 48 <option value="">{{ text_select }}</option> 49 50 {% for country in countries %} 51 {% if country.country_id == country_id %} 52 53 <option value="{{ country.country_id }}" selected="selected">{{ country.name }}</option> 54 55 {% else %} 56 57 <option value="{{ country.country_id }}">{{ country.name }}</option> 58 59 {% endif %} 60 {% endfor %} 61 62 </select> 63 </div> 64 </div> 65 <div class="form-group required"> 66 <label class="col-sm-2 control-label" for="input-shipping-zone">{{ entry_zone }}</label> 67 <div class="col-sm-10"> 68 <select name="zone_id" id="input-shipping-zone" class="form-control"> 69 </select> 70 </div> 71 </div> 72 {% for custom_field in custom_fields %} 73 {% if custom_field.location == 'address' %} 74 {% if custom_field.type == 'select' %} 75 <div class="form-group{% if custom_field.required %} required {% endif %} custom-field" data-sort="{{ custom_field.sort_order }}"> 76 <label class="col-sm-2 control-label" for="input-shipping-custom-field{{ custom_field.custom_field_id }}">{{ custom_field.name }}</label> 77 <div class="col-sm-10"> 78 <select name="custom_field[{{ custom_field.location }}][{{ custom_field.custom_field_id }}]" id="input-shipping-custom-field{{ custom_field.custom_field_id }}" class="form-control"> 79 <option value="">{{ text_select }}</option> 80 81 {% for custom_field_value in custom_field.custom_field_value %} 82 {% if address_custom_field[custom_field.custom_field_id] and custom_field_value.custom_field_value_id == address_custom_field[custom_field.custom_field_id] %} 83 84 <option value="{{ custom_field_value.custom_field_value_id }}" selected="selected">{{ custom_field_value.name }}</option> 85 86 {% else %} 87 88 <option value="{{ custom_field_value.custom_field_value_id }}">{{ custom_field_value.name }}</option> 89 90 {% endif %} 91 {% endfor %} 92 93 </select> 94 </div> 95 </div> 96 {% endif %} 97 {% if custom_field.type == 'radio' %} 98 <div class="form-group{% if custom_field.required %} required {% endif %} custom-field" data-sort="{{ custom_field.sort_order }}"> 99 <label class="col-sm-2 control-label">{{ custom_field.name }}</label> 100 <div class="col-sm-10"> 101 <div id="input-shipping-custom-field{{ custom_field.custom_field_id }}"> {% for custom_field_value in custom_field.custom_field_value %} 102 <div class="radio"> {% if address_custom_field[custom_field.custom_field_id] and custom_field_value.custom_field_value_id == address_custom_field[custom_field.custom_field_id] %} 103 <label> 104 <input type="radio" name="custom_field[{{ custom_field.location }}][{{ custom_field.custom_field_id }}]" value="{{ custom_field_value.custom_field_value_id }}" checked="checked" /> 105 {{ custom_field_value.name }}</label> 106 {% else %} 107 <label> 108 <input type="radio" name="custom_field[{{ custom_field.location }}][{{ custom_field.custom_field_id }}]" value="{{ custom_field_value.custom_field_value_id }}" /> 109 {{ custom_field_value.name }}</label> 110 {% endif %} </div> 111 {% endfor %} </div> 112 </div> 113 </div> 114 {% endif %} 115 {% if custom_field.type == 'checkbox' %} 116 <div class="form-group{% if custom_field.required %} required {% endif %} custom-field" data-sort="{{ custom_field.sort_order }}"> 117 <label class="col-sm-2 control-label">{{ custom_field.name }}</label> 118 <div class="col-sm-10"> 119 <div id="input-shipping-custom-field{{ custom_field.custom_field_id }}"> {% for custom_field_value in custom_field.custom_field_value %} 120 <div class="checkbox"> {% if address_custom_field[custom_field.custom_field_id] and custom_field_value.custom_field_value_id in address_custom_field[custom_field.custom_field_id] %} 121 <label> 122 <input type="checkbox" name="custom_field[{{ custom_field.location }}][{{ custom_field.custom_field_id }}][]" value="{{ custom_field_value.custom_field_value_id }}" checked="checked" /> 123 {{ custom_field_value.name }}</label> 124 {% else %} 125 <label> 126 <input type="checkbox" name="custom_field[{{ custom_field.location }}][{{ custom_field.custom_field_id }}][]" value="{{ custom_field_value.custom_field_value_id }}" /> 127 {{ custom_field_value.name }}</label> 128 {% endif %} </div> 129 {% endfor %} </div> 130 </div> 131 </div> 132 {% endif %} 133 {% if custom_field.type == 'text' %} 134 <div class="form-group{% if custom_field.required %} required {% endif %} custom-field" data-sort="{{ custom_field.sort_order }}"> 135 <label class="col-sm-2 control-label" for="input-shipping-custom-field{{ custom_field.custom_field_id }}">{{ custom_field.name }}</label> 136 <div class="col-sm-10"> 137 <input type="text" name="custom_field[{{ custom_field.location }}][{{ custom_field.custom_field_id }}]" value="{% if address_custom_field[custom_field.custom_field_id] %}{{ address_custom_field[custom_field.custom_field_id] }}{% else %}{{ custom_field.value }}{% endif %}" placeholder="{{ custom_field.name }}" id="input-shipping-custom-field{{ custom_field.custom_field_id }}" class="form-control" /> 138 </div> 139 </div> 140 {% endif %} 141 {% if custom_field.type == 'textarea' %} 142 <div class="form-group{% if custom_field.required %} required {% endif %} custom-field" data-sort="{{ custom_field.sort_order }}"> 143 <label class="col-sm-2 control-label" for="input-shipping-custom-field{{ custom_field.custom_field_id }}">{{ custom_field.name }}</label> 144 <div class="col-sm-10"> 145 <textarea name="custom_field[{{ custom_field.location }}][{{ custom_field.custom_field_id }}]" rows="5" placeholder="{{ custom_field.name }}" id="input-shipping-custom-field{{ custom_field.custom_field_id }}" class="form-control">{% if address_custom_field[custom_field.custom_field_id] %}{{ address_custom_field[custom_field.custom_field_id] }}{% else %}{{ custom_field.value }}{% endif %}</textarea> 146 </div> 147 </div> 148 {% endif %} 149 {% if custom_field.type == 'file' %} 150 <div class="form-group{% if custom_field.required %} required {% endif %} custom-field" data-sort="{{ custom_field.sort_order }}"> 151 <label class="col-sm-2 control-label">{{ custom_field.name }}</label> 152 <div class="col-sm-10"> 153 <button type="button" id="button-shipping-custom-field{{ custom_field.custom_field_id }}" data-loading-text="{{ text_loading }}" class="btn btn-default"><i class="fa fa-upload"></i> {{ button_upload }}</button> 154 <input type="hidden" name="custom_field[{{ custom_field.location }}][{{ custom_field.custom_field_id }}]" value="{% if address_custom_field[custom_field.custom_field_id] %} {{ address_custom_field[custom_field.custom_field_id] }} {% endif %}" /> 155 </div> 156 </div> 157 {% endif %} 158 {% if custom_field.type == 'date' %} 159 <div class="form-group{% if custom_field.required %} required {% endif %} custom-field" data-sort="{{ custom_field.sort_order }}"> 160 <label class="col-sm-2 control-label" for="input-shipping-custom-field{{ custom_field.custom_field_id }}">{{ custom_field.name }}</label> 161 <div class="col-sm-10"> 162 <div class="input-group date"> 163 <input type="text" name="custom_field[{{ custom_field.location }}][{{ custom_field.custom_field_id }}]" value="{% if address_custom_field[custom_field.custom_field_id] %}{{ address_custom_field[custom_field.custom_field_id] }}{% else %}{{ custom_field.value }}{% endif %}" placeholder="{{ custom_field.name }}" data-date-format="YYYY-MM-DD" id="input-shipping-custom-field{{ custom_field.custom_field_id }}" class="form-control" /> 164 <span class="input-group-btn"> 165 <button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button> 166 </span></div> 167 </div> 168 </div> 169 {% endif %} 170 {% if custom_field.type == 'time' %} 171 <div class="form-group{% if custom_field.required %} required {% endif %} custom-field" data-sort="{{ custom_field.sort_order }}"> 172 <label class="col-sm-2 control-label" for="input-shipping-custom-field{{ custom_field.custom_field_id }}">{{ custom_field.name }}</label> 173 <div class="col-sm-10"> 174 <div class="input-group time"> 175 <input type="text" name="custom_field[{{ custom_field.location }}][{{ custom_field.custom_field_id }}]" value="{% if address_custom_field[custom_field.custom_field_id] %}{{ address_custom_field[custom_field.custom_field_id] }}{% else %}{{ custom_field.value }}{% endif %}" placeholder="{{ custom_field.name }}" data-date-format="HH:mm" id="input-shipping-custom-field{{ custom_field.custom_field_id }}" class="form-control" /> 176 <span class="input-group-btn"> 177 <button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button> 178 </span></div> 179 </div> 180 </div> 181 {% endif %} 182 {% if custom_field.type == 'time' %} 183 <div class="form-group{% if custom_field.required %} required {% endif %} custom-field" data-sort="{{ custom_field.sort_order }}"> 184 <label class="col-sm-2 control-label" for="input-shipping-custom-field{{ custom_field.custom_field_id }}">{{ custom_field.name }}</label> 185 <div class="col-sm-10"> 186 <div class="input-group datetime"> 187 <input type="text" name="custom_field[{{ custom_field.location }}][{{ custom_field.custom_field_id }}]" value="{% if address_custom_field[custom_field.custom_field_id] %}{{ address_custom_field[custom_field.custom_field_id] }}{% else %}{{ custom_field.value }}{% endif %}" placeholder="{{ custom_field.name }}" data-date-format="YYYY-MM-DD HH:mm" id="input-shipping-custom-field{{ custom_field.custom_field_id }}" class="form-control" /> 188 <span class="input-group-btn"> 189 <button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button> 190 </span></div> 191 </div> 192 </div> 193 {% endif %} 194 {% endif %} 195 {% endfor %} 196 <div class="buttons"> 197 <div class="pull-right"> 198 <input type="button" value="{{ button_continue }}" id="button-guest-shipping" data-loading-text="{{ text_loading }}" class="btn btn-primary" /> 199 </div> 200 </div> 201 </form> 202 <script type="text/javascript"><!-- 203 // Sort the custom fields 204 $('#collapse-shipping-address .form-group[data-sort]').detach().each(function() { 205 if ($(this).attr('data-sort') >= 0 && $(this).attr('data-sort') <= $('#collapse-shipping-address .form-group').length-2) { 206 $('#collapse-shipping-address .form-group').eq(parseInt($(this).attr('data-sort'))+2).before(this); 207 } 208 209 if ($(this).attr('data-sort') > $('#collapse-shipping-address .form-group').length-2) { 210 $('#collapse-shipping-address .form-group:last').after(this); 211 } 212 213 if ($(this).attr('data-sort') == $('#collapse-shipping-address .form-group').length-2) { 214 $('#collapse-shipping-address .form-group:last').after(this); 215 } 216 217 if ($(this).attr('data-sort') < -$('#collapse-shipping-address .form-group').length-2) { 218 $('#collapse-shipping-address .form-group:first').before(this); 219 } 220 }); 221 //--></script> 222 <script type="text/javascript"><!-- 223 $('#collapse-shipping-address button[id^=\'button-shipping-custom-field\']').on('click', function() { 224 var node = this; 225 226 $('#form-upload').remove(); 227 228 $('body').prepend('<form enctype="multipart/form-data" id="form-upload" style="display: none;"><input type="file" name="file" /></form>'); 229 230 $('#form-upload input[name=\'file\']').trigger('click'); 231 232 if (typeof timer != 'undefined') { 233 clearInterval(timer); 234 } 235 236 timer = setInterval(function() { 237 if ($('#form-upload input[name=\'file\']').val() != '') { 238 clearInterval(timer); 239 240 $.ajax({ 241 url: 'index.php?route=tool/upload', 242 type: 'post', 243 dataType: 'json', 244 data: new FormData($('#form-upload')[0]), 245 cache: false, 246 contentType: false, 247 processData: false, 248 beforeSend: function() { 249 $(node).button('loading'); 250 }, 251 complete: function() { 252 $(node).button('reset'); 253 }, 254 success: function(json) { 255 $(node).parent().find('.text-danger').remove(); 256 257 if (json['error']) { 258 $(node).parent().find('input[name^=\'custom_field\']').after('<div class="text-danger">' + json['error'] + '</div>'); 259 } 260 261 if (json['success']) { 262 alert(json['success']); 263 264 $(node).parent().find('input[name^=\'custom_field\']').attr('value', json['file']); 265 } 266 }, 267 error: function(xhr, ajaxOptions, thrownError) { 268 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 269 } 270 }); 271 } 272 }, 500); 273 }); 274 //--></script> 275 <script type="text/javascript"><!-- 276 $('.date').datetimepicker({ 277 language: '{{ datepicker }}', 278 pickTime: false 279 }); 280 281 $('.time').datetimepicker({ 282 language: '{{ datepicker }}', 283 pickDate: false 284 }); 285 286 $('.datetime').datetimepicker({ 287 language: '{{ datepicker }}', 288 pickDate: true, 289 pickTime: true 290 }); 291 //--></script> 292 <script type="text/javascript"><!-- 293 $('#collapse-shipping-address select[name=\'country_id\']').on('change', function() { 294 $.ajax({ 295 url: 'index.php?route=checkout/checkout/country&country_id=' + this.value, 296 dataType: 'json', 297 beforeSend: function() { 298 $('#collapse-shipping-address select[name=\'country_id\']').prop('disabled', true); 299 }, 300 complete: function() { 301 $('#collapse-shipping-address select[name=\'country_id\']').prop('disabled', false); 302 }, 303 success: function(json) { 304 if (json['postcode_required'] == '1') { 305 $('#collapse-shipping-address input[name=\'postcode\']').parent().parent().addClass('required'); 306 } else { 307 $('#collapse-shipping-address input[name=\'postcode\']').parent().parent().removeClass('required'); 308 } 309 310 html = '<option value="">{{ text_select }}</option>'; 311 312 if (json['zone'] && json['zone'] != '') { 313 for (i = 0; i < json['zone'].length; i++) { 314 html += '<option value="' + json['zone'][i]['zone_id'] + '"'; 315 316 if (json['zone'][i]['zone_id'] == '{{ zone_id }}') { 317 html += ' selected="selected"'; 318 } 319 320 html += '>' + json['zone'][i]['name'] + '</option>'; 321 } 322 } else { 323 html += '<option value="0" selected="selected">{{ text_none }}</option>'; 324 } 325 326 $('#collapse-shipping-address select[name=\'zone_id\']').html(html); 327 }, 328 error: function(xhr, ajaxOptions, thrownError) { 329 alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText); 330 } 331 }); 332 }); 333 334 $('#collapse-shipping-address select[name=\'country_id\']').trigger('change'); 335 //--></script>