Ошибка при получении json-данных через POST ajax

Question

Я отправляю два значения другому php через ajax и пытаюсь вернуть два значения и отобразить их в Dropbox, а другой - в поле ввода. Это код Аякса:

function searchq6(){ 
var searchstate = $("input[name='region']").val(); 
var searchTxt = $("input[name='suburb']").val(); 
$.ajax({ 
url: 'search-suburb.php', 
type: 'POST', 
dataType: 'JSON', 
data: { 
    searchVal: searchTxt, 
    st:searchstate}, 
}) 
.done(function(response) { 
    var response = JSON.parse(response); 
    console.log(response); 
}) 
.fail(function(jqXHR, textStatus, errorThrown) { 
    console.log(errorThrown); 
}); 
} 

И это то, что я отправляю обратно из файла PHP:

$output = '' ; 
if (isset($_POST['searchVal'])){ 
$searchq = $_POST['searchVal']; 
$st = $_POST['st']; 
$query = mysqli_query($link, "SELECT DISTINCT title FROM `wp_locations` WHERE state='".$st."' AND `title` LIKE '%".$searchq."%' LIMIT 10")or  die("Could not search!"); 
if (!mysqli_query($link,$query)) 
{ 
     echo("Error description: " . mysqli_error($link)); 
} 
$count = mysqli_num_rows($query); 
if($count == 0){ 
    $output = '<option>No results!</option>'; 
}else{ 
    $suburb = array(); 
    $postcode = array(); 
while($row = mysqli_fetch_array($query)){ 
    $suburb[] = $row['title']; 
    $postcode[] = $row['title']; 
    //echo $suburb; 

} // while 
    $result = ['success'=> true, 'data'=> ['suburb'=> $suburb, 'postcode' => $postcode], 'error' => null]; 
    echo json_encode($result); 
} // else 
} // main if 

HTML:

Suburb:* <input type="text" name="suburb" list="sbb" required size="30" value="<?php echo $suburb; ?>" onkeyup="searchq6()" id="output"> 
    <datalist id="sbb" name="taskoption6" > 
      <option> </option> 
    </datalist> 
Postcode:* <input type="number" name="postcode" required value="<?php echo $postcode; ?>" id="postcode"> 

Я получаю эту ошибку в консоли:

SyntaxError: Unexpected token E 
at Object.parse (native) 
at m.parseJSON (http://site/js/jquery.min.js:5:15998) 
at Pb (http://site/js/jquery.min.js:5:18379) 
at x (http://site/js/jquery.min.js:5:21793) 
at XMLHttpRequest.send.b (http://site/js/jquery.min.js:5:26030) 

Answer 1

$.ajax({ 
     url: 'search-suburb.php', 
     type: 'POST', 
     dataType: 'JSON',//result is set to json 
     data: { 
      searchVal: searchTxt, 
      st: searchstate 
     }, 
    }) 
    .done(function(response) {//response parsed already 
     var response = JSON.parse(response);//no need to parse here 
     console.log(response); 
    }) 
    .fail(function(jqXHR, textStatus, errorThrown) { 
     console.log(errorThrown); 
    }); 

Вы установите dataType:'json' поэтому нет необходимости разбирать

var response = JSON.parse(response); console.log(response);

Вы можете иметь это console.log(response); непосредственно без var response = JSON.parse(response);