I'm making an ajax call and need to change the value of the <h1> tag with the response:
$('#openTickets').ready(function() {
var open = $.ajax({
time: 15,
url: "/opened-tickets",
dataType: "JSON",
async: false
}).responseJSON;
$('#openTickets').val(open);
});
<div class="value">
<h1 class="count tkts-total" id="openTickets"></h1>
<p>Aberto e em dia</p>
</div>
Some fixes that you should take into account.
async: false is deprecated, no longer used, it was a terrible idea of the old one that was removed, deprecated. $(document).ready( instead of $('#openTickets').ready( , because if you use it as is, jQuery will not find this element if the HTML has not been read, whereas document is global, made available to JavaScript since the beginning of loading page $.ajax is asynchronous which means you have to use callback success
.html() or .text() , to change the value of elements that can receive value from the user uses .val() . In the case of a heading you should use .html() or .text() . So your code might look like this:
$(document).ready(function() {
$.ajax({
time: 15,
url: "/opened-tickets",
dataType: "JSON",
success: function(res) {
$('#openTickets').html(res.responseJSON);
}
});
});
Note: I do not see where you are passing data to ajax, I assume it is not accurate.