<script type="text/javascript"><!--
$(document).ready(function() {
$('select[name^=\'option\']').trigger('change');
});
$(document).on('change', 'select[name^=\'option\']', function() {
$(this).after('<i class="fa fa-spinner selection-wait"></i>');
var value = $(this).val();
var parent_id = $(this).attr('name').replace (/[^\d.]/g, '');
$.ajax({
url: 'index.php?route=product/product/dependentoption&parent_id=' + parent_id + '&value=' + value + '&product_id=36',
type: 'get',
dataType: 'json',
success: function(json) {
$('.selection-wait').remove();
if (json['option']) {
for (i = 0; i < json['option'].length; i++) {
if (json['option'][i]['type'] == 'select') {
$('#input-option' + json['option'][i]['product_option_id']).stop().fadeOut('medium');
$('#input-option' + json['option'][i]['product_option_id']).siblings('.control-label').stop().fadeOut('medium');
var html = '';
html += '<option value=""> --- Please Select --- </option>';
for (j = 0; j < json['option'][i]['option_value'].length; j++) {
$('#input-option' + json['option'][i]['product_option_id']).fadeIn('medium');
$('#input-option' + json['option'][i]['product_option_id']).siblings('.control-label').fadeIn('medium');
html += '<option value="' + json['option'][i]['option_value'][j]['product_option_value_id'] + '">' + json['option'][i]['option_value'][j]['name'];
if (json['option'][i]['option_value'][j]['price']) {
html += ' (' + json['option'][i]['option_value'][j]['price_prefix'] + json['option'][i]['option_value'][j]['price'] + ')';
}
html += '</option>';
}
$('select[name=\'option[' + json['option'][i]['product_option_id'] + ']\']').html(html);
} else if (json['option'][i]['type'] == 'radio' || json['option'][i]['type'] == 'checkbox' || json['option'][i]['type'] == 'image') {
$('#input-option' + json['option'][i]['product_option_id']).stop().fadeOut('medium');
$('#input-option' + json['option'][i]['product_option_id']).siblings('.control-label').stop().fadeOut('medium');
$('#input-option' + json['option'][i]['product_option_id']).children().hide();
$('#input-option' + json['option'][i]['product_option_id']).find('input').prop('checked', false);
for (j = 0; j < json['option'][i]['option_value'].length; j++) {
$('#input-option' + json['option'][i]['product_option_id']).fadeIn('medium');
$('#input-option' + json['option'][i]['product_option_id']).siblings('.control-label').fadeIn('medium');
$('#input-option' + json['option'][i]['product_option_id']).find('input[value=\'' + json['option'][i]['option_value'][j]['product_option_value_id'] + '\']').parent().show();
$('#input-option' + json['option'][i]['product_option_id']).find('input[value=\'' + json['option'][i]['option_value'][j]['product_option_value_id'] + '\']').parent().parent().show();
}
} else {
if (json['option'][i]['option_value']) {
$('#input-option' + json['option'][i]['product_option_id']).stop().fadeIn('medium');
$('#input-option' + json['option'][i]['product_option_id']).siblings('.control-label').fadeIn('medium');
} else {
$('#input-option' + json['option'][i]['product_option_id']).stop().fadeOut('medium');
$('#input-option' + json['option'][i]['product_option_id']).siblings('.control-label').stop().fadeOut('medium');
}
}
}
}
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
});
//--></script>