To all that could give their feedback. An Ajax json request is made with a form submit handler that triggers it.
After an Ajax json request/response – Get following error from error function: Error: parsererror with message: SyntaxError: Unexpected token d
Json is seen to be returned in Chrome network tab.
HTML FORM —-
<div class=”tour” data-daily-price=”357″>
<h2>Paris, France Tour</h2>
<p>
$<span id=”total”>2,499</span> for <span id=”nights-count”>7</span> Nights
</p>
<form action=”tour.json” method=”POST”>
<p>
<label for=”nights”>Number of Nights</label>
</p>
<p>
<input type=”number” name=”nights” id=”nights” value=”7″>
</p>
<input type=”submit” value=”book”>
</form>
</div>
JS ——
$(document).ready(function() {
$(‘form’).on(‘submit’, function(event) {
event.preventDefault();
$.ajax(‘tour.json’, {
type: ‘POST’,
dataType: ‘json’,
data: $(‘form’).serialize(),
success: function(response) {
var html = ”;
$.each(response, function(index, entry) {
html += ‘<ul>’;
html += ‘<li>Destination’ +entry.description+'</li>’;
html += ‘<li>Price’ +entry.price+'</li>’;
html += ‘<li>Nights’ +entry.nights+ ‘</li>’;
html += ‘<li>Confirmation’ +entry.confirmation+ ‘</li>’;
html += ‘</ul>’;
});
$(‘.tour’).html(html).fadeIn();
},
error: function(request, errorType, errorMessage) {
console.log(‘Error: ‘ + errorType + ‘ with message: ‘ + errorMessage);
},
contentType: ‘application/json’
});
});
});