Ola, tenho uma dúvida que já pesquisei muito e não consigo achar a solução.
Tenho um campo de busca no site que é auto completado pelo banco de dados.
Faço a consulta conforme o usuário começa digitar o produto. No entanto, ao selecionar um dos itens que aparecem eu não consigo fazer abrir a página correspondente ao item.
A tabela do banco tem 3 campos: id, nome do produto, url da página do produto.
Eu consigo trazer o nome do produto pro input que é o primeiro passo, mas não consigo fazer abrir a url dele.
O PHP que faz o select e joga o item no input é o seguinte:
<?php
include_once './conexao.php';
$busca = filter_input(INPUT_GET, 'term', FILTER_SANITIZE_STRING);
//SQL para selecionar os registros
$result_msg_busca = "SELECT * FROM produtos WHERE produto LIKE '%".$busca."%' ORDER BY produto ASC LIMIT 7";
//Seleciona os registros
$resultado_msg_cont = $conn->prepare($result_msg_busca);
$resultado_msg_cont->execute();
while($row_msg_cont = $resultado_msg_cont->fetch(PDO::FETCH_ASSOC)){
$data[] = $row_msg_cont['produto'];
$datal[] = $row_msg_cont['url'];
}
echo json_encode($data);
?>
Eu uso o $data no echo json_encode para trazer os itens conforme o usuário digita.
Mas não consegui fazer abrir o url presente no $datal, tentei concatenar no echo formando um a href, mas claro que não funciona e ele vem o código todo escrito pro input.
O html da página é simples, e a conexão com o banco é PDO.
o HTML:
<DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>TESTE BUSCA</title>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
</head>
<body>
<h1> Pesquisar </h1>
<form method="POST" action="">
<label> Produto </label>
<input type="text" placeholder="Escreva o nome do produto." name="busca" id="busca">
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="js/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script>
$(function(){
$("#busca").autocomplete({
source: 'busca_msg.php'
});
});
</script>
</body>
</html>
Se alguém puder me ajudar, agradeço.