3 METODOS POST FETCH JSON ENVIO DATOS HACIA LA API
METODO 1
3-view.html
<input type="text" id="caja1">
document.getElementById('caja1').addEventListener('keyup', doSearch);
function doSearch () {
var caj = document.getElementById("caja1").value;
const formData = {
n: caj
};
fetch("2-controller.php", {
method:"POST",
headers: {
'Content-Type': 'application/json; charset=utf-8'
},
body: JSON.stringify(formData)
})
.then(res => res.json())
.then(res => {
let results = document.getElementById("results");
results.innerHTML = "";
let output = '';
if (res !== null) { for (let r of res) {
results.innerHTML += `<div>${r.id} - ${r.nombre}</div>`;
output += `
<tr>
<td>${r.id}</td>
<td>${r.nombre}</td>
</tr>
`;
}
}
document.getElementById("response").innerHTML = output;
});
return false;
} //FIN FUNCION
doSearch();
</script>
<table>
<thead>
<tr>
<th>id</th>
<th>Nombre</th>
</tr>
</thead>
<tbody id='response'></tbody>
</table>
<div id="results"></div>
/////////////////////////////////
2-controller.php
$input = file_get_contents('php://input');
$decode = json_decode($input, true);
$nombre = $decode["n"];
$results = $_DB->select("SELECT * FROM `personas`WHERE `nombre` LIKE '%{$nombre}%'");
echo json_encode(count($results)==0 ? null : $results);
/////////////////////////////////////////////
METODO 2
var caj = document.getElementById("caja1").value;
var buscar = {
'n' : caj
}
dato = JSON.stringify(buscar);
fetch("2-controller.php", {
method:"POST",
body:dato
})
.then(res => res.json())
.then(res => {
//////////////////////////////////////
2-controller.php
require "1-model.php";
$input = file_get_contents('php://input');
$decode = json_decode($input, true);
$nombre = $decode["n"];
$results = $_DB->select("SELECT * FROM `personas`WHERE `nombre` LIKE '%{$nombre}%'");
echo json_encode(count($results)==0 ? null : $results);
////////////////////////////////////////////
METODO 3
var caj = document.getElementById("caja1").value;
const formData = new URLSearchParams();
formData.append('n', caj);
fetch("2-controller.php", {
method:"POST",
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
body: formData.toString()
})
.then(res => res.json())
.then(res => {
/////////////////////////////////
2-controller.php
<?php
require "1-model.php";
$nombre = $_POST['n'];
$results = $_DB->select("SELECT * FROM `personas`WHERE `nombre` LIKE '%{$nombre}%'");
echo json_encode(count($results)==0 ? null : $results);
-------------------------------------------------
1-model.php
<?php
class DB {
public $error = "";
private $pdo = null;
private $stmt = null;
function __construct () {
$this->pdo = new PDO(
"mysql:host=".DB_HOST.";dbname=".DB_NAME.";charset=".DB_CHARSET,
DB_USER, DB_PASSWORD, [
PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,
PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC
]);
}
function __destruct () {
if ($this->stmt!==null) { $this->stmt = null; }
if ($this->pdo!==null) { $this->pdo = null; }
}
function select ($sql) {
$this->stmt = $this->pdo->prepare($sql);
$this->stmt->execute();
return $this->stmt->fetchAll();
}
}
define("DB_HOST", "localhost");
define("DB_NAME", "bdpersonas");
define("DB_CHARSET", "utf8");
define("DB_USER", "root");
define("DB_PASSWORD", "root");
$_DB = new DB();
Comentarios
Publicar un comentario