issue :
– Calling ajax request and write text in the html .
problem :
– the first time when calling ajax and write the values in the div successfully
– the second time the ajax get the data (in the page source ) but the values in the div doesn’t change although the cache: false .
– i try to generate random number to show the issue well.
Code:
1-Ajax call :
$("#Finish").click(function () {
$.ajax({
type: 'POST',
async: true,
url: document.location.origin + "/air/ajaxCalls.php",
dataType: 'json',
cache: false,
data: {
ajaxType: "Finish",
examid: 1,
index: 2,
qid: <? php echo $currentquestion ?> ,
ansid: $('#tags').val(),
},
success: function (data) {
// alert("success");
if (data) {
// alert(data.status);
// $("questiontext").html("next question");
// alert("data");
// alert('empty')
$('#tags').val("");
document.getElementById('questiontext').innerHTML = "<p>" + "<?php echo mt_rand() . getQuesName($currentquestion) . rand(); ?>" + "</p>";
document.getElementById('answerstext').innerHTML = "<?php getAnswers($currentquestion); ?>"
$("#questiontext").html("<?php echo mt_rand()?>");
$('input[type="checkbox"]').on('change', function () {
$('input[type="checkbox"]').not(this).prop('checked', false);
});
$('#check1').click(function () {});
$('#choose1, #check1').click(function () {
$('#check1').click();
});
$('#check2').click(function () {});
$('#choose2, #check2').click(function () {
$('#check2').click();
});
$('#check3').click(function () {});
$('#choose3, #check3').click(function () {
$('#check3').click();
});
$('#check4').click(function () {});
$('#choose4, #check4').click(function () {
$('#check4').click();
});
function Populate() {
vals = $('input[type="checkbox"]:checked').map(function () {
return this.value;
}).get().join(',');
// console.log(vals);
$('#tags').val(vals);
}
$('input[type="checkbox"]').on('change', function () {
Populate()
}).change();
if (data.status == 1) { ///sucess
alert('answer inserted');
}
} else {
alert("Error : Please try again");
return false;
// no data found
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("Error : " + errorThrown);
}
});
});
2 – receive calls:
if ($_POST['ajaxType'] == "Finish") {
echo json_encode(array("status" => 1));
}
3- div (html)
<div id="questiontext">
<p>
</p>
</div>
I had this exact same issue a couple days ago. The issue is that in your AJAX call:
Change your url to the main wordpress AJAX file. Usually it can be found in the /wp-admin/ folder of your website. Once you change the URL from
to
Go into your main function file and add a new AJAX call. For example, create something like this:
Now you have your populate function in your functions.php file rather than your jquery file. This makes it so all you have to do with your AJAX call is specify the action you want to preform. This ammounts to adding
into your data array.
Hopefully this helps out a bit, let me know if I can clarify more.