Hello I have problem with error message in my console after ajax request and I would like to know how can I prevent it.
Error message:
VM1779:2 Uncaught SyntaxError: Unexpected end of JSON input
at JSON.parse (<anonymous>)
at Object.success (all.min.js:698)
at u (all.min.js:2)
at Object.fireWith [as resolveWith] (all.min.js:2)
at k (all.min.js:2)
at XMLHttpRequest.<anonymous> (all.min.js:2)
JQUERY AJAX function:
function changeSlider() {
let flatType = $('.active').attr('id');
$.ajax({
type: 'POST',
url: './ajax.php',
data: {
flatType: flatType
},
success: function(response) {
var obj = JSON.parse(response);
$('.gallery-finishing .gallery-top .swiper-wrapper').html(obj['galleryTop']);
$('.gallery-finishing .gallery-thumbs .swiper-wrapper').html(obj['galleryThumb']);
initGallery();
},
error: function(e) {
console.log(e);
}
});
}
changeSlider();
ajax.php
if(isset($_POST['flatType'])){
$results['galleryTop'] = '
<div class="swiper-slide" id="slide-1">
<div class="swiper-slide__img">
<img src="/assets/img/slide-w-1.jpg" alt="">
</div>
</div>
<div class="swiper-slide" id="slide-2">
<div class="swiper-slide__img">
<img src="/assets/img/slide-w-2.jpg" alt="">
</div>
</div>
<div class="swiper-slide" id="slide-3">
<div class="swiper-slide__img">
<img src="/assets/img/slide-w-3.jpg" alt="">
</div>
</div>
';
$results['galleryThumb'] = '<div class="swiper-slide">
<div class="swiper-slide__info">
<p>Lorem</p>
</div>
</div>
<div class="swiper-slide">
<div class="swiper-slide__info">
<p>Ipsum</p>
</div>
</div>
<div class="swiper-slide">
<div class="swiper-slide__info">
<p>Dolor</p>
</div>
</div>';
echo json_encode($results);
}
I need to get multiple responses for a single ajax request.
I know that the problem is with parse JSON object, which include HTML code.
So, how can i fixed it? Thanks for help :)
Comments
Post a Comment