У меня есть 2 варианта выбора. Когда how_heard_cat_id обновляется, я хочу изменить опции select2 для marketing_event_id.
<strong>Referral Source:</strong>
<a href="#" id="how_heard_cat_id" class="edit_me" data-type="select" data-value="<?php echo $invoice->data()->how_heard_cat_id; ?>" data-placement="right" data-original-title="Please enter the invoice referral source."></a>
<strong>Promotion Code:</strong> <a href="#" id="marketing_event_id" class="edit_me" data-value="<?php echo $invoice->data()->marketing_event_id; ?>" data-placement="right" data-original-title="Please enter the invoice promotion code." data-type="select2">
<?php echo $invoice->data()->promo_code; ?></a>
По умолчанию параметры marketing_event_id заполняются следующим образом:
//get the promo codes for the select2 box for xeditable.
var promo_codes = [];
$.getJSON('ajax_get_json.php?what=location_promo_codes_by_type', {
type_id: $('#how_heard_cat_id').attr('data-value')
},
function(data) {
$.each(data, function(index) {
promo_codes.push({
id: data[index].value,
text: data[index].text
});
});
});
$('#marketing_event_id').editable({
emptytext: ".....",
pk: <?php echo $invoice_id; ?>,
url: "ajax_xeditable_update.php?table=invoices",
source: promo_codes,
select2: {
width: 200,
placeholder: 'Select promotion code...',
allowClear: true
}
});
Вот код для how_heard_cat_id:
$('#how_heard_cat_id').editable({
emptytext: ".....",
prepend: "",
source: "ajax_get_json.php?what=howheard",
pk: "<?php echo $invoice_id; ?>",
url: "ajax_xeditable_update.php?table=invoices",
success: function(response, newValue) {
//get the promo codes for the select2 box for xeditable.
var promo_codes_updated = [];
$.ajax({
dataType: "json",
url: "ajax_get_json.php?what=location_promo_codes_by_type",
data: {
type_id: newValue
},
success: function(data_updated) {
//if there are promo codes once change how heard, then re-create editable with those options
if(data_updated.length !== 0) {
$.each(data_updated, function(index) {
promo_codes_updated.push({
id: data_updated[index].value,
text: data_updated[index].text
});
});
} else {
promo_codes_updated = [];
}
$('#marketing_event_id').editable("destroy");
$('#marketing_event_id').editable({
emptytext: ".....",
pk: "<?php echo $invoice_id; ?>",
url: "ajax_xeditable_update.php?table=invoices",
source: promo_codes_updated,
select2: {
width: 200,
placeholder: 'Select promotion code...',
allowClear: true
}
});
$('#marketing_event_id').editable('toggleDisabled');
}
});
}
});
Значения по умолчанию работают и нормально загружаются с помощью x-editable. Когда вы меняете how_heard_cat_id, новые маркетинговые промо-коды загружаются в мою сетевую вкладку, но я НЕ обновляю marketing_event_id!
Я получаю консольную ошибку, основанную на функции уничтожения в моем скрипте.
Uncaught TypeError: Cannot read property 'data' of undefined
Мысли? Моя идея состояла в том, чтобы полностью уничтожить xeditable marketing_event_id и воссоздать его, если how_heard_cat_id изменится.