Opencart can't load Region / State dropdown - themes

Question

I'm using opencart 1.5.5.1 with a theme (sancart) and I'm getting a very annoying bug.
In the modules checkout/cart and account/register the dropdown menu for Region/State field won't load the relative values (i guess are called zone or zone_id) and remains empty, blank.
The same function instead works well in the module checkout/checkout proceeding both as Guest or user registration.
Googleing around I've notice that is a pretty common bug with many themes, above all for those using SSH (that's not my case), but I couldn't find any real solution.
You can see my website at the URL http://i-tec.pro (ID: guest , PW: itec2013)
register.tpl
<?php echo $header; ?>
<?php if ($error_warning) { ?>
<div class="warning"><?php echo $error_warning; ?></div>
<?php } ?>
<?php echo $column_left; ?><?php echo $column_right; ?>
<div id="content"><?php echo $content_top; ?>
<div class="breadcrumb">
<?php foreach ($breadcrumbs as $breadcrumb) { ?>
<?php echo $breadcrumb['separator']; ?><?php echo $breadcrumb['text']; ?>
<?php } ?>
</div>
<h1><?php echo $heading_title; ?></h1><div class="padding20">
<p><?php echo $text_account_already; ?></p>
<form action="<?php echo $action; ?>" method="post" enctype="multipart/form-data">
<h2><?php echo $text_your_details; ?></h2>
<div class="content">
<table class="form">
<tr>
<td><span class="required">*</span> <?php echo $entry_firstname; ?></td>
<td><input type="text" name="firstname" value="<?php echo $firstname; ?>" />
<?php if ($error_firstname) { ?>
<span class="error"><?php echo $error_firstname; ?></span>
<?php } ?></td>
</tr>
<tr>
<td><span class="required">*</span> <?php echo $entry_lastname; ?></td>
<td><input type="text" name="lastname" value="<?php echo $lastname; ?>" />
<?php if ($error_lastname) { ?>
<span class="error"><?php echo $error_lastname; ?></span>
<?php } ?></td>
</tr>
<tr>
<td><span class="required">*</span> <?php echo $entry_email; ?></td>
<td><input type="text" name="email" value="<?php echo $email; ?>" />
<?php if ($error_email) { ?>
<span class="error"><?php echo $error_email; ?></span>
<?php } ?></td>
</tr>
<tr>
<td><span class="required">*</span> <?php echo $entry_telephone; ?></td>
<td><input type="text" name="telephone" value="<?php echo $telephone; ?>" />
<?php if ($error_telephone) { ?>
<span class="error"><?php echo $error_telephone; ?></span>
<?php } ?></td>
</tr>
<tr>
<td><?php echo $entry_fax; ?></td>
<td><input type="text" name="fax" value="<?php echo $fax; ?>" /></td>
</tr>
</table>
</div>
<h2><?php echo $text_your_address; ?> </h2>
<div class="content">
<table class="form">
<tr>
<td><?php echo $entry_company; ?></td>
<td><input type="text" name="company" value="<?php echo $company; ?>" /></td>
</tr>
<tr>
<td><span class="required">*</span> <?php echo $entry_address_1; ?></td>
<td><input type="text" name="address_1" value="<?php echo $address_1; ?>" />
<?php if ($error_address_1) { ?>
<span class="error"><?php echo $error_address_1; ?></span>
<?php } ?></td>
</tr>
<tr>
<td><?php echo $entry_address_2; ?></td>
<td><input type="text" name="address_2" value="<?php echo $address_2; ?>" /></td>
</tr>
<tr>
<td><span class="required">*</span> <?php echo $entry_city; ?></td>
<td><input type="text" name="city" value="<?php echo $city; ?>" />
<?php if ($error_city) { ?>
<span class="error"><?php echo $error_city; ?></span>
<?php } ?></td>
</tr>
<tr>
<td><span class="required">*</span> <?php echo $entry_postcode; ?></td>
<td><input type="text" name="postcode" value="<?php echo $postcode; ?>" />
<?php if ($error_postcode) { ?>
<span class="error"><?php echo $error_postcode; ?></span>
<?php } ?></td>
</tr>
<tr>
<td><span class="required">*</span> <?php echo $entry_country; ?></td>
<td><select name="country_id" onchange="$('select[name=\'zone_id\']').load('index.php?route=account/register/zone&country_id=' + this.value + '&zone_id=<?php echo $zone_id; ?>');">
<option value=""><?php echo $text_select; ?></option>
<?php foreach ($countries as $country) { ?>
<?php if ($country['country_id'] == $country_id) { ?>
<option value="<?php echo $country['country_id']; ?>" selected="selected"><?php echo $country['name']; ?></option>
<?php } else { ?>
<option value="<?php echo $country['country_id']; ?>"><?php echo $country['name']; ?></option>
<?php } ?>
<?php } ?>
</select>
<?php if ($error_country) { ?>
<span class="error"><?php echo $error_country; ?></span>
<?php } ?></td>
</tr>
<tr>
<td><span class="required">*</span> <?php echo $entry_zone; ?></td>
<td><select name="zone_id">
</select>
<?php if ($error_zone) { ?>
<span class="error"><?php echo $error_zone; ?></span>
<?php } ?></td>
</tr>
</table>
</div>
<h2><?php echo $text_your_password; ?></h2>
<div class="content">
<table class="form">
<tr>
<td><span class="required">*</span> <?php echo $entry_password; ?></td>
<td><input type="password" name="password" value="<?php echo $password; ?>" />
<?php if ($error_password) { ?>
<span class="error"><?php echo $error_password; ?></span>
<?php } ?></td>
</tr>
<tr>
<td><span class="required">*</span> <?php echo $entry_confirm; ?></td>
<td><input type="password" name="confirm" value="<?php echo $confirm; ?>" />
<?php if ($error_confirm) { ?>
<span class="error"><?php echo $error_confirm; ?></span>
<?php } ?></td>
</tr>
</table>
</div>
<h2><?php echo $text_newsletter; ?></h2>
<div class="content">
<table class="form">
<tr>
<td><?php echo $entry_newsletter; ?></td>
<td><?php if ($newsletter == 1) { ?>
<input type="radio" name="newsletter" value="1" checked="checked" />
<?php echo $text_yes; ?>
<input type="radio" name="newsletter" value="0" />
<?php echo $text_no; ?>
<?php } else { ?>
<input type="radio" name="newsletter" value="1" />
<?php echo $text_yes; ?>
<input type="radio" name="newsletter" value="0" checked="checked" />
<?php echo $text_no; ?>
<?php } ?></td>
</tr>
</table>
</div>
<?php if ($text_agree) { ?>
<div class="buttons">
<div class="right"><?php echo $text_agree; ?>
<?php if ($agree) { ?>
<input type="checkbox" name="agree" value="1" checked="checked" />
<?php } else { ?>
<input type="checkbox" name="agree" value="1" />
<?php } ?>
<input type="submit" value="<?php echo $button_continue; ?>" class="button" />
</div>
</div>
<?php } else { ?>
<div class="buttons">
<div class="right">
<input type="submit" value="<?php echo $button_continue; ?>" class="button" />
</div>
</div>
<?php } ?>
</form></div>
<?php echo $content_bottom; ?></div>
<script type="text/javascript"><!--
$('select[name=\'zone_id\']').load('index.php?route=account/register/zone&country_id=<?php echo $country_id; ?>&zone_id=<?php echo $zone_id; ?>');
//--></script>
<script type="text/javascript"><!--
$('.colorbox').colorbox({
width: 560,
height: 560
});
//--></script>
<?php echo $footer; ?>
cart.tpl
<?php echo $header; ?>
<?php if ($attention) { ?>
<div class="attention"><?php echo $attention; ?><img src="catalog/view/theme/default/image/close.png" alt="" class="close" /></div>
<?php } ?>
<?php if ($success) { ?>
<div class="success"><?php echo $success; ?><img src="catalog/view/theme/default/image/close.png" alt="" class="close" /></div>
<?php } ?>
<?php if ($error_warning) { ?>
<div class="warning"><?php echo $error_warning; ?><img src="catalog/view/theme/default/image/close.png" alt="" class="close" /></div>
<?php } ?>
<?php echo $column_left; ?><?php echo $column_right; ?>
<div id="content"><?php echo $content_top; ?>
<div class="breadcrumb">
<?php foreach ($breadcrumbs as $breadcrumb) { ?>
<?php echo $breadcrumb['separator']; ?><?php echo $breadcrumb['text']; ?>
<?php } ?>
</div>
<h1><?php echo $heading_title; ?><div class="padding20">
<?php if ($weight) { ?>
(<?php echo $weight; ?>)
<?php } ?>
</h1>
<form action="<?php echo $action; ?>" method="post" enctype="multipart/form-data">
<div class="cart-info">
<table>
<thead>
<tr>
<td class="image"><?php echo $column_image; ?></td>
<td class="name"><?php echo $column_name; ?></td>
<td class="model"><?php echo $column_model; ?></td>
<td class="quantity"><?php echo $column_quantity; ?></td>
<td class="price"><?php echo $column_price; ?></td>
<td class="total"><?php echo $column_total; ?></td>
</tr>
</thead>
<tbody>
<?php foreach ($products as $product) { ?>
<tr>
<td class="image"><?php if ($product['thumb']) { ?>
<img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" title="<?php echo $product['name']; ?>" />
<?php } ?></td>
<td class="name"><?php echo $product['name']; ?>
<?php if (!$product['stock']) { ?>
<span class="stock">***</span>
<?php } ?>
<div>
<?php foreach ($product['option'] as $option) { ?>
- <small><?php echo $option['name']; ?>: <?php echo $option['value']; ?></small><br />
<?php } ?>
</div>
<?php if ($product['reward']) { ?>
<small><?php echo $product['reward']; ?></small>
<?php } ?></td>
<td class="model"><?php echo $product['model']; ?></td>
<td class="quantity"><input type="text" name="quantity[<?php echo $product['key']; ?>]" value="<?php echo $product['quantity']; ?>" size="1" />
<input type="image" src="catalog/view/theme/default/image/update.png" alt="<?php echo $button_update; ?>" title="<?php echo $button_update; ?>" />
<img src="catalog/view/theme/default/image/remove.png" alt="<?php echo $button_remove; ?>" title="<?php echo $button_remove; ?>" /></td>
<td class="price"><?php echo $product['price']; ?></td>
<td class="total"><?php echo $product['total']; ?></td>
</tr>
<?php } ?>
<?php foreach ($vouchers as $vouchers) { ?>
<tr>
<td class="image"></td>
<td class="name"><?php echo $vouchers['description']; ?></td>
<td class="model"></td>
<td class="quantity"><input type="text" name="" value="1" size="1" disabled="disabled" />
<img src="catalog/view/theme/default/image/remove.png" alt="<?php echo $text_remove; ?>" title="<?php echo $button_remove; ?>" /></td>
<td class="price"><?php echo $vouchers['amount']; ?></td>
<td class="total"><?php echo $vouchers['amount']; ?></td>
</tr>
<?php } ?>
</tbody>
</table>
</div>
</form>
<?php if ($coupon_status || $voucher_status || $reward_status || $shipping_status) { ?>
<h2><?php echo $text_next; ?></h2>
<div class="content">
<p><?php echo $text_next_choice; ?></p>
<table class="radio">
<?php if ($coupon_status) { ?>
<tr class="highlight">
<td><input type="radio" name="next" value="coupon" id="use_coupon" /></td>
<td><label for="use_coupon"><?php echo $text_use_coupon; ?></label></td>
</tr>
<?php } ?>
<?php if ($voucher_status) { ?>
<tr class="highlight">
<td><input type="radio" name="next" value="voucher" id="use_voucher" /></td>
<td><label for="use_voucher"><?php echo $text_use_voucher; ?></label></td>
</tr>
<?php } ?>
<?php if ($reward_status) { ?>
<tr class="highlight">
<td><input type="radio" name="next" value="reward" id="use_reward" /></td>
<td><label for="use_reward"><?php echo $text_use_reward; ?></label></td>
</tr>
<?php } ?>
<?php if ($shipping_status) { ?>
<tr class="highlight">
<td><input type="radio" name="next" value="shipping" id="shipping_estimate" /></td>
<td><label for="shipping_estimate"><?php echo $text_shipping_estimate; ?></label></td>
</tr>
<?php } ?>
</table>
</div>
<div class="cart-module">
<div id="coupon" class="content">
<form action="<?php echo $action; ?>" method="post" enctype="multipart/form-data">
<?php echo $entry_coupon; ?>
<input type="text" name="coupon" value="<?php echo $coupon; ?>" />
<input type="hidden" name="next" value="coupon" />
<input type="submit" value="<?php echo $button_coupon; ?>" class="button" />
</form>
</div>
<div id="voucher" class="content">
<form action="<?php echo $action; ?>" method="post" enctype="multipart/form-data">
<?php echo $entry_voucher; ?>
<input type="text" name="voucher" value="<?php echo $voucher; ?>" />
<input type="hidden" name="next" value="voucher" />
<input type="submit" value="<?php echo $button_voucher; ?>" class="button" />
</form>
</div>
<div id="reward" class="content">
<form action="<?php echo $action; ?>" method="post" enctype="multipart/form-data">
<?php echo $entry_reward; ?>
<input type="text" name="reward" value="<?php echo $reward; ?>" />
<input type="hidden" name="next" value="reward" />
<input type="submit" value="<?php echo $button_reward; ?>" class="button" />
</form>
</div>
<div id="shipping" class="content">
<p><?php echo $text_shipping_detail; ?></p>
<table>
<tr>
<td><span class="required">*</span> <?php echo $entry_country; ?></td>
<td><select name="country_id" onchange="$('select[name=\'zone_id\']').load('index.php?route=checkout/cart/zone&country_id=' + this.value + '&zone_id=<?php echo $zone_id; ?>');">
<option value=""><?php echo $text_select; ?></option>
<?php foreach ($countries as $country) { ?>
<?php if ($country['country_id'] == $country_id) { ?>
<option value="<?php echo $country['country_id']; ?>" selected="selected"><?php echo $country['name']; ?></option>
<?php } else { ?>
<option value="<?php echo $country['country_id']; ?>"><?php echo $country['name']; ?></option>
<?php } ?>
<?php } ?>
</select></td>
</tr>
<tr>
<td><span class="required">*</span> <?php echo $entry_zone; ?></td>
<td><select name="zone_id">
</select></td>
</tr>
<tr>
<td><span class="required">*</span> <?php echo $entry_postcode; ?></td>
<td><input type="text" name="postcode" value="<?php echo $postcode; ?>" /></td>
</tr>
</table>
<input type="button" value="<?php echo $button_quote; ?>" id="button-quote" class="button" />
</div>
<?php } ?>
</div>
<div class="cart-total">
<table id="total">
<?php foreach ($totals as $total) { ?>
<tr>
<td colspan="5" class="right"><b><?php echo $total['title']; ?>:</b></td>
<td class="right"><?php echo $total['text']; ?></td>
</tr>
<?php } ?>
</table>
</div>
<div class="buttons">
<div class="right"><?php echo $button_checkout; ?></div>
<div class="center"><?php echo $button_shopping; ?></div>
</div></div>
<?php echo $content_bottom; ?></div>
<script type="text/javascript"><!--
$('input[name=\'next\']').bind('change', function() {
$('.cart-module > div').hide();
$('#' + this.value).show();
});
<?php if ($next == 'coupon') { ?>
$('#use_coupon').trigger('click');
<?php } ?>
<?php if ($next == 'voucher') { ?>
$('#use_voucher').trigger('click');
<?php } ?>
<?php if ($next == 'reward') { ?>
$('#use_reward').trigger('click');
<?php } ?>
<?php if ($next == 'shipping') { ?>
$('#shipping_estimate').trigger('click');
<?php } ?>
//--></script>
<?php if ($shipping_status) { ?>
<script type="text/javascript"><!--
$('#button-quote').live('click', function() {
$.ajax({
url: 'index.php?route=checkout/cart/quote',
type: 'post',
data: 'country_id=' + $('select[name=\'country_id\']').val() + '&zone_id=' + $('select[name=\'zone_id\']').val() + '&postcode=' + encodeURIComponent($('input[name=\'postcode\']').val()),
dataType: 'json',
beforeSend: function() {
$('#button-quote').attr('disabled', true);
$('#button-quote').after('<span class="wait"> <img src="catalog/view/theme/default/image/loading.gif" alt="" /></span>');
},
complete: function() {
$('#button-quote').attr('disabled', false);
$('.wait').remove();
},
success: function(json) {
$('.success, .warning, .attention, .error').remove();
if (json['error']) {
if (json['error']['warning']) {
$('#notification').html('<div class="warning" style="display: none;">' + json['error']['warning'] + '<img src="catalog/view/theme/default/image/close.png" alt="" class="close" /></div>');
$('.warning').fadeIn('slow');
$('html, body').animate({ scrollTop: 0 }, 'slow');
}
if (json['error']['country']) {
$('select[name=\'country_id\']').after('<span class="error">' + json['error']['country'] + '</span>');
}
if (json['error']['zone']) {
$('select[name=\'zone_id\']').after('<span class="error">' + json['error']['zone'] + '</span>');
}
if (json['error']['postcode']) {
$('input[name=\'postcode\']').after('<span class="error">' + json['error']['postcode'] + '</span>');
}
}
if (json['shipping_method']) {
html = '<h2><?php echo $text_shipping_method; ?></h2>';
html += '<form action="<?php echo $action; ?>" method="post" enctype="multipart/form-data">';
html += ' <table class="radio">';
for (i in json['shipping_method']) {
html += '<tr>';
html += ' <td colspan="3"><b>' + json['shipping_method'][i]['title'] + '</b></td>';
html += '</tr>';
if (!json['shipping_method'][i]['error']) {
for (j in json['shipping_method'][i]['quote']) {
html += '<tr class="highlight">';
if (json['shipping_method'][i]['quote'][j]['code'] == '<?php echo $shipping_method; ?>') {
html += '<td><input type="radio" name="shipping_method" value="' + json['shipping_method'][i]['quote'][j]['code'] + '" id="' + json['shipping_method'][i]['quote'][j]['code'] + '" checked="checked" /></td>';
} else {
html += '<td><input type="radio" name="shipping_method" value="' + json['shipping_method'][i]['quote'][j]['code'] + '" id="' + json['shipping_method'][i]['quote'][j]['code'] + '" /></td>';
}
html += ' <td><label for="' + json['shipping_method'][i]['quote'][j]['code'] + '">' + json['shipping_method'][i]['quote'][j]['title'] + '</label></td>';
html += ' <td style="text-align: right;"><label for="' + json['shipping_method'][i]['quote'][j]['code'] + '">' + json['shipping_method'][i]['quote'][j]['text'] + '</label></td>';
html += '</tr>';
}
} else {
html += '<tr>';
html += ' <td colspan="3"><div class="error">' + json['shipping_method'][i]['error'] + '</div></td>';
html += '</tr>';
}
}
html += ' </table>';
html += ' <br />';
html += ' <input type="hidden" name="next" value="shipping" />';
html += ' <input type="submit" value="<?php echo $button_shipping; ?>" class="button" />';
html += '</form>';
$.colorbox({
overlayClose: true,
opacity: 0.5,
width: '600px',
height: '400px',
href: false,
html: html
});
}
}
});
});
//--></script>
<script type="text/javascript"><!--
$('select[name=\'zone_id\']').load('index.php?route=checkout/cart/zone&country_id=<?php echo $country_id; ?>&zone_id=<?php echo $zone_id; ?>');
//--></script>
<?php } ?>
<?php echo $footer; ?>
Thank you in advance!

Answer 1

The problem is in the URL it is trying to load:
http://www.i-tec.pro/index.php?route=account/register/zone&country_id=30
In the controller catalog/controller/account/register.php there is no such an action called zone - therefore the server returns a 404 response and no zones are loaded.
This action is not present in that controller at least from version 1.5.3 (have no access to older versions right now, will check that later) - but You are using the latest OC version.
Probably the theme is not compatible with newer versions of OC - check that with the theme creators...
EDIT: Should You wish to repair the template for Yourself, add this JavaScript code at the end of the register.tpl
$('select[name=\'country_id\']').bind('change', function() {
$.ajax({
url: 'index.php?route=account/register/country&country_id=' + this.value,
dataType: 'json',
beforeSend: function() {
$('select[name=\'country_id\']').after('<span class="wait"> <img src="catalog/view/theme/default/image/loading.gif" alt="" /></span>');
},
complete: function() {
$('.wait').remove();
},
success: function(json) {
if (json['postcode_required'] == '1') {
$('#postcode-required').show();
} else {
$('#postcode-required').hide();
}
html = '<option value=""><?php echo $text_select; ?></option>';
if (json['zone'] != '') {
for (i = 0; i < json['zone'].length; i++) {
html += '<option value="' + json['zone'][i]['zone_id'] + '"';
if (json['zone'][i]['zone_id'] == '<?php echo $zone_id; ?>') {
html += ' selected="selected"';
}
html += '>' + json['zone'][i]['name'] + '</option>';
}
} else {
html += '<option value="0" selected="selected"><?php echo $text_none; ?></option>';
}
$('select[name=\'zone_id\']').html(html);
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
});
$('select[name=\'country_id\']').trigger('change');
and remove any previous $('select[\'name=country_id\']').change(...); calls.

Answer 2

change the javascript code from catalog/view/theme/YOUR THEME/template/account/register.tpl to this code here
<script type="text/javascript"><!--
$('select[name=\'country_id\']').bind('change', function() {
$.ajax({
url: 'index.php?route=account/register/country&country_id=' + this.value,
dataType: 'json',
beforeSend: function() {
$('select[name=\'country_id\']').after('<span class="wait"> <img src="catalog/view/theme/default/image/loading.gif" alt="" /></span>');
},
complete: function() {
$('.wait').remove();
},
success: function(json) {
if (json['postcode_required'] == '1') {
$('#postcode-required').show();
} else {
$('#postcode-required').hide();
}
html = '<option value=""><?php echo $text_select; ?></option>';
if (json['zone'] != '') {
for (i = 0; i < json['zone'].length; i++) {
html += '<option value="' + json['zone'][i]['zone_id'] + '"';
if (json['zone'][i]['zone_id'] == '<?php echo $zone_id; ?>') {
html += ' selected="selected"';
}
html += '>' + json['zone'][i]['name'] + '</option>';
}
} else {
html += '<option value="0" selected="selected"><?php echo $text_none; ?></option>';
}
$('select[name=\'zone_id\']').html(html);
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
});
$('select[name=\'country_id\']').trigger('change');
//--></script>