Klasični post zahtjev iz frome

Pod pretpostavkom da imamo već instaliran CodeIgniter.
Pravimo kontroler:

php spark make:controller Post --suffix

Zatim pravimo HTML template ./app/Views/posts.php i dodajemo sadržaj:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
</head>
<body>
  
  
<form action="<?= site_url('post') ?>" method="post">

<p>Name: <?php echo $name ?></p>
<p>Email: <?php echo $email ?></p>
<br>
<p>Unesi podatke: </p>
<input type="text" name="name" placeholder="Enter name"/> <br><br>
<input type="email" name="email" placeholder="Enter email"/><br><br>

<button type="submit">Submit</button>

</form>  

</body>
</html>

Dodajemo putanju u “/app/Config/routes.php”:

$routes->get('post', 'PostController::index');
$routes->post('post', 'PostController::index');

U PostController::index unosimo:

    public function index()
    {
		$templateData = [
			'name' => null,
			'email' => null,
		];
		
		
		if ($this->request->getMethod() == "post") 
		{
			$templateData['name'] = $this->request->getVar("name");
			$templateData['email'] = $this->request->getVar("email");	
		}
		
		
        return view('posts', $templateData);
    }

Javascript post zahtjev

Pravimo kontroler “Fetch”:

php spark make:controller Fetch --suffix

HTML template ./app/Views/fetch.php i dodajemo sadržaj:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
</head>
<body>
  
<input class="ds-input"  placeholder="POST SEND" /> <br><br>
<input class="ds-output" placeholder="POST RETURN" readonly /> <br><br>
<button onclick="clickAction()"> Klik </button>

</body>
</html>
<script>

const clickAction = async () => {

	const inputElement = document.querySelector('.ds-input');
	const outputElement = document.querySelector('.ds-output');
		
	var postData = new FormData();  
	postData.append('name', inputElement.value);

    try {
		const response = await fetch('/fetch', {
			method: 'POST', 
			body: postData,
		});

		const jsonUserData = await response.json();
		outputElement.value = jsonUserData.name;
		console.log( jsonUserData );
	}
	catch (error) {
		console.error(error);
	}
}

</script>

Putanje (/app/Config/routes.php)

$routes->get('fetch', 'FetchController::index');
$routes->post('fetch', 'FetchController::index');

FetchController:

<?php

namespace App\Controllers;

use App\Controllers\BaseController;

class FetchController extends BaseController
{
    public function index()
    {
        if ($this->request->getMethod() == "post") 
		{
			$name = $this->request->getVar("name");
			echo json_encode(['name'=> $name]);
			die();
		}
		
		return view('fetch');
    }
}

Umjesto “vanilla” odgovora, možemo koristiti i built-in:

$data = [
    'success' => true,
    'id'      => 123,
];

$this->response->setStatusCode(500);
return $this->response->setJSON(data);