Si quieres crear formularios por javascript, te recomendaría que utilizaras un framework como VueJs, angular o la librería de React, y utilizar el increíble CakePHP para generar las Apis de los controladores de tus modelos de base de datos.
si quieres usar Jquery es más engorroso, pero obviamente posible:
de entrada en el controlador para poder mandar cosas por ajax tendrías de desabilitar el security component del formulario:
public function beforeFilter(Event $event)
{
$this->Security->setConfig('unlockedActions', ['add', 'edit', 'delete']); // o los que te hagas
}
y luego poner el código ajax:
$(document).ready(function() {
// Al clicar ek submit
$('form').submit(function(event) {
// metes en una variable los datos de formulario, ojo tiene que estar igual de como los llamaste para hacer el CRUD en cakephp
var formData = {
'name' : $('input[name=name]').val(),
'email' : $('input[name=email]').val(),
'superheroAlias' : $('input[name=superheroAlias]').val()
};
// process the form
$.ajax({
type : 'POST', // define el tipo de metodo
url : '/usuarios/add', // la url de tru controlador y acción
data : formData, // el objeto
dataType : 'json', // de tipo json
encode : true
})
// usas una promesa de callback
.done(function(data) {
// y miras q se mandan bien los datos
console.log(data);
//
});
event.preventDefault();
});
});
Muy importante, de hecho lo más importante habilita para poder mandar fomularios json.
https://book.cakephp.org/3.0/en/development/rest.html
// src/Controller/RecipesController.php
class UsuariosController extends AppController
{
public function initialize()
{
parent::initialize();
$this->loadComponent('RequestHandler');
}
public function index()
{
$usuarios = $this->Usuarios->find('all');
$this->set([
'usuarios' => $usuarios,
'_serialize' => ['usuarios']
]);
}
public function view($id)
{
$usuario = $this->Usuarios->get($id);
$this->set([
'usuario' => $usuario,
'_serialize' => ['usuario']
]);
}
public function add()
{
$recipe = $this->Usuarios->newEntity($this->request->getData());
if ($this->Usuarios->save($recipe)) {
$message = 'Saved';
} else {
$message = 'Error';
}
$this->set([
'message' => $message,
'recipe' => $usuario,
'_serialize' => ['message', 'usuario']
]);
}
public function edit($id)
{
$recipe = $this->Usuarios->get($id);
if ($this->request->is(['post', 'put'])) {
$recipe = $this->Usuarios->patchEntity($recipe, $this->request->getData());
if ($this->Usuarios->save($recipe)) {
$message = 'Saved';
} else {
$message = 'Error';
}
}
$this->set([
'message' => $message,
'_serialize' => ['message']
]);
}
public function delete($id)
{
$recipe = $this->Usuarios->get($id);
$message = 'Deleted';
if (!$this->Usuarios->delete($recipe)) {
$message = 'Error';
}
$this->set([
'message' => $message,
'_serialize' => ['message']
]);
}
}
Y las routas claro:
https://book.cakephp.org/3.0/en/development/routing.html#routing-file-extensions
Router::scope('/', function ($routes) {
// Prior to 3.5.0 use `extensions()`
$routes->setExtensions(['json', 'xml']);
});
Para más info:
esto esta muy bueno:
https://scotch.io/tutorials/submitting-ajax-forms-with-jquery
url
pondrías/usuarios/add
, de esta forma puedes enviar la información al servidor y manejarla según sean tus necesidades.