I am combining two functions into a single function and need to pass the value of my id
from calla()
to callb()
so callb()
can also use that information in its AJAX call. When these were two different functions, a button was clicked which triggered my callb()
function and passed the id
to it. Now that they are one single function with two calls, I am uncertain how to pass this along.
I know it's going to be some type of event listener but when I wrap callb()
in a jQuery(document).load(
then it tells me callb()
is undefined. If I remove callb()
then it doesn't run the function at all.
jQuery(document).on('popup/show', (event, id) => {
if (id === 123) {
function callA() {
jQuery.ajax({
data: {
action: 'list_count'
},
type: 'post',
url: my_ajax.ajax_url,
dataType: 'JSON',
success: function(data) {
var id = jQuery().data('id')
var html = '';
jQuery.each(data, function(key, value) {
html += '<div class="accordion-header ui-accordion-header ui-helper-reset ui-state-default ui-accordion-icons ui-corner-all" id="' + value.id + '" style="display:table-row">';
html += '<div class="image" style="display: table-cell";>' + value.img + '</div>';
html += '<div style="display: table-cell";>' + value.Name + '</div>';
html += '<div style="display: table-cell">' + value.Size + '</div>';
html += '<div style="display: table-cell"> ' + value.Number + ' </div>';
html += '<div class="tdid_' + value.id + '" style="display: table-cell">' + value.Status + '</div>';
html += '</div>';
html += '<div id="cid_' + value.id + '" class="bg_clear ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" style="display: table-cell">';
html += '<div class="bg_clear ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" style="display: table-cell"></div>';
html += ' </div>';
});
jQuery('#list').html(html);
}
});
}
function callB(id) {
jQuery.ajax({
type: 'post',
url: my_ajax.ajax_url,
data: {
action: 'options_function',
cid: id
},
success: function(data) {
jQuery(data).after('#cid_' + id)
console.log(data);
console.log(id);
}
});
}
callA();
callB();
}
});
Attempted alternate code for function b
jQuery(document).load(function callB(id) {
jQuery.ajax({
type: 'post',
url: my_ajax.ajax_url,
data: {
action: 'options_function',
cid: id
},
success: function(data) {
jQuery(data).after('#cid_' + id)
console.log(data);
console.log(id);
}
});
});
callA();
// callB();
EDIT 1- Add callb
into the success of calla
jQuery(document).on('popup/show', (event, id) => {
if (id === 123) {
function callA() {
jQuery.ajax({
data: {
action: 'list_count'
},
type: 'post',
url: my_ajax.ajax_url,
dataType: 'JSON',
success: function(data) {
var id = jQuery().data('id')
var html = '';
jQuery.each(data, function(key, value) {
html += '<div class="accordion-header ui-accordion-header ui-helper-reset ui-state-default ui-accordion-icons ui-corner-all" id="' + value.id + '" style="display:table-row">';
html += '<div class="image" style="display: table-cell";>' + value.img + '</div>';
html += '<div style="display: table-cell";>' + value.Name + '</div>';
html += '<div style="display: table-cell">' + value.Size + '</div>';
html += '<div style="display: table-cell"> ' + value.Number + ' </div>';
html += '<div class="tdid_' + value.id + '" style="display: table-cell">' + value.Status + '</div>';
html += '</div>';
html += '<div id="cid_' + value.id + '" class="bg_clear ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" style="display: table-cell">';
html += '<div class="bg_clear ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom" style="display: table-cell"></div>';
html += ' </div>';
});
jQuery('#list').html(html);
function callB(id) {
jQuery.ajax({
type: 'post',
url: my_ajax.ajax_url,
data: {
action: 'options_function',
cid: id
},
success: function(data) {
jQuery(data).after('#cid_' + id)
console.log(data);
console.log(id);
}
});
}
}
});
}
callA();
callB(); /* <<<<<<<<<<< tried with this commented out or on, doesnt matter/*
}
});
Edit 2 - Original button code
<a href="javascript:void(0)" id="options-btn" class="button" onclick="function callB('+ value.id+')" data-id="'+ value.id+'"> </a>
callB(id)
in thesuccess
function ofcallA()
. – Barmar Jan 13 at 21:25load
event you want to callcallA
followed bycallB
. Do I have this right? Can you move both functions out of the event handler, then put the call tocallB
into the success handler forcallA
? – SuperJumbo Jan 13 at 21:26callA
completes I needcallb
to fire, that is correct. I previously had it in the success call but it would not let me use a function in there. I can try again although the same question remains, how to pass the variable? – user14955679 Jan 13 at 21:35callb
just before the closing}
of the Success of A, it prevents anything from being done withcallb
. It just ignores it – user14955679 Jan 13 at 21:38