500 Internal Server Error when pass data in $.ajax - php

Question

I am receiving a 500 internal server error when making an ajax call.
$(document).ready(function(){
$("#txtSearch").change(function(){
var search = $("#txtSearch").val();
var str = 'search=' + search;
$.ajax({
type: "POST",
url: "searchProcess.php",
data: str,
dataType: "json",
success: function(data) {
if (data["type"] == "1") {
alert('Please Enter Value To Search');
}else if (data['type'] == "2") {
alert('No Such of This Event In Database');
}else if (data['type'] == "3") {
$('#gallery').hide().html(data['data']).fadeIn('5s');
}
}
});
});
});
searchProcess.php
if (!isset($_POST["search"])) {
print json_encode(['type'=>'1']);
}else{
$seValue = "%{$_POST['search']}%";
$querySel = "SELECT * FROM gallery WHERE galleryTitle LIKE :title OR date LIKE :dat";
$stmtquerySel = $conn->prepare($querySel);
$stmtquerySel->bindParam('title',$seValue);
$stmtquerySel->bindParam('dat',$seValue);
$stmtquerySel->execute();
if ($stmtquerySel->rowCount() == 0) {
print json_encode(['type'=>'2']);
}else{
$galleryGrid = "";
while ($rowQuerySel = $stmtquerySel->fetch()) {
$id = $rowQuerySel['galleryId'];
$image = $rowQuerySel['image'];
$title = $rowQuerySel['galleryTitle'];
$date = $rowQuerySel['date'];
$galleryGrid .= "<div class='col-lg-4 col-sm-6'>
<div class=''>
<a href='gallerydetails.php?id=$id'>
<img src='img/$image' width='100%'>
<div>Event Name:$title</div>
<div>Date :$date</div>
</br></br>
</a>
</div>
</div>
";
}
$galleryGrid .="<div class='col-md-11 text-center'>
<button type='submit' class='btn btn-primary btn-lg' onClick=location.href='gallery.php'>Back</button>
</div>";
print json_encode(['type'=>'3', 'data'=>$galleryGrid]);
}
}
when I try it on localhost it run , but when upload to server then will get 500 internal error

Answer 1

Use this
print json_encode(array('type'=>'3', 'data'=>$galleryGrid));
instead of
print json_encode(['type'=>'3', 'data'=>$galleryGrid]);