- Consulta de Articulos
- Agregar nuevos Articulos
- Modificar Articulo
- Eliminar Articulo
En primer lugar debemos crear nuestra tabla posts en Mysql:
CREATE TABLE posts (
id INT UNSIGNED AUTO_INCREMENT PRIMARY KEY,
title VARCHAR(50),
body TEXT,
created DATETIME DEFAULT NULL,
modified DATETIME DEFAULT NULL
);
INSERT INTO posts (title,body,created)
VALUES ('Primer Post', 'Este es el cuerpo del primer post.', NOW());
INSERT INTO posts (title,body,created)
VALUES ('Segundo Post', 'Este es el cuerpo del segundo post.', NOW());
INSERT INTO posts (title,body,created)
VALUES ('Tercer Post', 'Este es el cuerpo del tercer post.', NOW());
var $default = array('driver' => 'mysql',
'connect' => 'mysql_connect',
'host' => 'localhost',
'login' => 'Tu_login',
'password' => 'Tu_password',
'database' => 'cake' );
< ? php class Post extends AppModel { var $name = 'Post'; var $validate = array( 'title' => VALID_NOT_EMPTY,
'body' => VALID_NOT_EMPTY
);
}
? >
Mediante la creación de un modelo es que se puede interactuar con la base de datos, con él se tiene las fundaciones para hacer las operaciones de ver, agregar, editar y eliminar.
Los modelos en CakePhp los debemos colocar en /app/models, en este caso el archivo que estamos creando es /app/models/post.php
Post->findCount();
$conditions = array("id"=>"> 0");
$fields = array("id", "title", "body", "created");
$order = "Post.id DESC";
$limit = 10;
$this->set('pagination', $total_rows);
$this->pageTitle='Pagina Inicial';
$this->set('posts', $this->Post->findAll($conditions, $fields, $order, $limit));
}
function view($id)
{
$this->pageTitle='Articulos';
$this->Post->id = $id;
$this->set('post', $this->Post->read());
}
function add()
{
$this->pageTitle='Agregar Post';
if (!empty($this->data))
{
if ($this->Post->save($this->data))
{
$this->flash('Your post has been saved.','/posts');
}
}
}
function delete($id)
{
$this->pageTitle='Borrar Articulo';
$this->Post->del($id);
$this->flash('The post with id: '.$id.' has been deleted.', '/posts');
}
function edit($id = null)
{
if (empty($this->data))
{
$this->Post->id = $id;
$this->data = $this->Post->read();
}
else
{
if ($this->Post->save($this->data['Post']))
{
$this->flash('Your post has been updated.','/posts');
}
}
}
}
? >
Las vistas de Cake deben ser colocadas en el directorio /app/views cada una dentro de un directorio llamado de acuerdo al controlador al que pertenecen (en este caso tendremos que crear un directorio llamado "posts" asi /app/views/posts/index.thtml
<h1> Blog posts </h1>
<div id="cuerpo">
< ? php foreach ($posts as $post): echo $post['Post']['id']; ? >
<div class="titulo">
<h1>
< ? php echo 'Titulo:'; echo $post['Post']['title']; echo '<a href="/posts/add"> Agregar Articulo </a>'; ? >
< ? php echo $html->link('Borrar',"/posts/delete/{$post['Post']['id']}",null,'Seguro?')?>
< ? php echo $html->link('Editar', '/posts/edit/'.$post['Post']['id']);?>
</h1>
<h3>
< ? php echo 'Creacion: '; echo $post['Post']['created']; ?>
</h3 >
</div>
<div class="arti">
<h4>
</h4>
</div>
</div>
Esta es la vista para agregar un Articulo:
/app/views/posts/add.thtml
<h1> Agregar Articulo </h1>
<form method="post" action="url('/posts/add')?>">
<p>
Titulo:
input('Post/title', array('size' => '40'))?>
tagErrorMsg('Post/title', 'Title is required.') ?>
</p>
<p>
Cuerpo del Articulo:
textarea('Post/body', array('rows'=>'10')) ?>
tagErrorMsg('Post/body', 'Body is required.') ?>
</p>
<p>
submit('Guardar post') ?>
</p>
</form>
Esta la vista para editar un Articulo:
/app/views/posts/edit.thtml
<h1> Editar Articulo </h1>
< form method="post" action="url('/posts/edit')?>" >
hidden('Post/id'); ?>
<p>
Title:
input('Post/title', array('size' => '40'))?>
tagErrorMsg('Post/title', 'Title is required.') ?>
</p>
< p >
Body:
textarea('Post/body', array('rows'=>'10')) ?>
tagErrorMsg('Post/body', 'Body is required.') ?>
</p>
<p>
submit('Actualizar') ?>
</p>
< /form>
Aqui les dejo el archivo .css que utilice para este ejemplo, este lo debemos colocar dentro del directorio /app/webroot/css/ y nombrarlo "cake.generic.css"
*{
margin:0;
padding:0;
}
body{
font-family:"frutiger linotype","lucida grande",helvetica,arial,sans-serif;
text-align:center;
color:#333;
font-size: 76%;
}
/* General Style Info */
a{
color:#003d4c;
text-decoration:underline;
}
a:hover{
color:#003d4c;
text-decoration:none;
}
a img{
border:none;
}
h1, h2, h3, h4{
font-weight:normal;
}
h1{
color: #003d4c;
margin:2px ;
font-size: 140%;
}
h2{
color:#c6c65b;
padding-top: 1em;
margin:0.3em 0;
font-size: 180%;
}
h3{
color:#003d4c;
padding-top:2px;
font-size: 120%;
}
h4{
color:#660000;
padding-top:0.5em;
font-size:120%;
}
ul, li {
margin: 0 12px 0 0;
padding-top: 2px;
}
#cuerpo{
color: black;
padding :10px 10px 10px 10px ;
border: 1px dotted #000000;
font-size: 80%;
}
.titulo{
color: black;
padding :10px 10px 10px 10px ;
border-top: 2px dotted orange;
font-size: 100%;
}
.arti{
color: #002e4d;
padding :20px 10px 50px 10px ;
font-size: 100%;
}
/* Layout */
#container{
text-align:justify;
border: 2px solid #000000;
margin: 10px 10px 10px 10px;
}
#header{
background-color:orange;
margin: 10px 10px 10px 10px ;
padding: 4px 20px;
border: 2px solid #666666;
}
#content{
/*clear:both;*/
padding: 00px 40px 10px 40px;
background-color: #eee;
color: #333;
border: 1px dotted #333333;
margin: 10px 10px 10px 10px;
width:680px;
}
#sidebar{
clear:both;
float:right;
padding: 10px 40px 10px 40px;
background-color: #eee;
color: #333;
border: 1px dotted #333333;
margin: auto 10px auto;
width:100px;
}
#footer{
clear:both;
padding: 6px 10px;
background-color:orange;
text-align: right;
border: 2px solid #999999;
margin: 10px 10px 10px 10px;/* n1=arriba n2=der n3=abajo n4=izq*/
}
/* forms */
form {
margin-top: 2em;
}
form div{
vertical-align: text-top;
margin-left: 1em;
margin-bottom:2em;
}
form div.date{
margin-left: 0em;
}
label {
display: block;
width: 140px;
font-size: 14px;
padding-right: 20px;
}
input[type=checkbox] {
float: left;
clear: left;
margin: 2px 6px 7px 2px;
}
input, textarea {
clear: both;
display:block;
font-size: 14px;
font-family: inherit;
}
select {
clear: both;
vertical-align: text-bottom;
font-size: 14px;
font-family: inherit;
}
option {
font-size: 14px;
font-family: inherit;
padding: 0 0.3em;
}
input[type=submit] {
display: inline;
vertical-align: bottom;
}
div.required {
clear: both;
color:#222;
font-weight:bold;
}
div.submit {
clear: both;
margin-top: 40px;
margin-left: 140px;
}
Debemos colocar un layout para mostrar nuestras vistas en /app/views/layouts/default.thtml
< html >
< head >
< title > Mi sitio :: < ? php echo $title_for_layout; ?> < /title >
< /head >
< body >
< ? php echo $content_for_layout ?>
</body >
< /html >
Ok pues espero sea de su agrado este ejemplo, mas adelante escribire algunos otros donde aremos uso de los helpers de Ajax