docCodeIgniter : Tp4 Bd I - PRELIMINAIRE - Belsunce-Shop
download 
Report Transcription
CodeIgniter : Tp4 Bd I - PRELIMINAIRE - Belsunce-Shop
CodeIgniter : Tp4 Bd
I - PRELIMINAIRE
Prendre la MV avec WampServer.
1. Créer un dossier sous www/CodeIgniter/tp4. Dézipper le contenu de l’archive de
CodeIgniter dans ce dossier.
2. Supprimer licence.txt et user_guide.
3. Configurer le fichier application/config/config.php :
Modifier le langage ($config['language'] = "french";) et installer le dossier
french dans application/language
Modifier la ligne : $config['base_url']= 'http://localhost/CodeIgniter/tp4/';
4. Positionner la feuille de style style.css dans le dossier tp4/css à créer.
5. Ouvrir le fichier application/config /autoload.php.
Charger les librairise suivantes :
Charger les helper ‘url’, ‘html’ et ‘form’ :
Sauvegarder et fermer ce fichier.
6. Créer la base lafleur2 avec le script lafleur2.sql
7. Ouvrir le fichier database.php et mettre les valeurs suivantes :
8. Ouvrir le fichier application/config/routes.php.
Modifier la ligne $route['default_controller'] en changeant le controleur par défaut :
$route['default_controller'] = « controleurTp4 » ;
SIO2
SLAM5 CodeIgniter Tp4
1
9. Créer le controleur application/controllers/controleurTp4.php :
<?php
class ControleurTp4 extends CI_Controller
{
function __construct()
{
parent:: __construct();
}
function index()
{
$this->load->view('vue1Tp4');
}
}
Sauvegarder le controleur.
10. Créer la vue application/views/vue1Tp4.php :
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<link rel='stylesheet' href="<?php echo base_url(); ?>/css/style.css" />
<title>Mavue</title>
</head>
<body>
<div id="pagewidth" >
<div id="header"><h1>Codeigniter-Tp4-BD-MVC</h1></div>
<div id="maincol"><h2>Utilisation des bases de donnees & du modele de conception
MVC</h2>
L'objectif de ce Tp est d'apprendre a utiliser :
<?php
echo ul(array('Select','Cbo dynamiques','Liens dynamiques'));
?>
</div>
<div id="leftcol"> <h2>Menu</h2>
<?php
echo anchor('controleurTp4','Accueil','Retour à l\'accueil');
echo br();
echo anchor('controleurTp4/listetable','Select','Lister une table');
echo br();
?>
</div>
</div>
</body>
</html>
SIO2
SLAM5 CodeIgniter Tp4
2
11. Tester :
II- APPLICATION
1 - Lister une table (Select)
Créer un modèle application/models/tp4_model.php :
L’objectif est de récupérer le contenu de la table produit. Deux solutions sont proposées
(lignes 15 et 17 plus classique). Le résultat de la requête est un jeu d’enegistrements
(RecordSet) $rs.
Ouvrir le fichier autoload.php pour charger ce modele :
Dans le controleur, on va définir une méthode listetable() qui va récupérer ce résultat
et l’afficher dans une vue vue2Tp4Select.
public function listetable() {
$tab['result']=$this->tp4_model->readall();
$this->load->view('vue2Tp4Select',$tab);
}
SIO2
SLAM5 CodeIgniter Tp4
3
Créer cette vue application/views/vue2Tp4Select.php :
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<link rel='stylesheet' href="<?php echo base_url(); ?>/css/style.css" />
<title>Mavue</title>
</head>
<body>
<div id="pagewidth" >
<div id="header"><h1>Codeigniter-Tp4-BD-MVC</h1></div>
<div id="maincol"><h2>Affichage du resultat d'une requete</h2>
<?php
for($i=0;$i<=count($result)-1;$i++)
{
echo $result[$i][‘libpdt’];
echo br();
}
?>
</div>
<div id="leftcol"> <h2>Menu</h2>
<?php
echo anchor(''controleurTp4'/index','Accueil','Retour à l\'accueil');
echo br();
echo anchor(''controleurTp4'/listetable','Select','Lister une table');
echo br();
?>
</div>
</div>
</body>
</html>
Tester :
SIO2
SLAM5 CodeIgniter Tp4
4
Affichage de ce résultat dans un tableau. On va utiliser la librairie table et mettre des
entêtes de colonnes (vue2Tp4Select) :
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<link rel='stylesheet' href="<?php echo base_url(); ?>/css/style.css" />
<title>Mavue</title>
</head>
<body>
<div id="pagewidth" >
<div id="header"><h1>Codeigniter-Tp4-BD-MVC</h1></div>
<div id="maincol"><h2>Affichage du resultat d'une requete</h2>
<?php
//
//
//
//
//
//
for($i=0;$i<=count($result)-1;$i++)
{
echo $result[$i][libpdt];
echo br();
}
affichage dans un tableau
$this->table->set_heading('Code', 'Designation', 'Prix', 'Image', 'CodeCategorie');
echo $this->table->generate($result);
?>
</div>
...
</html>
Tester :
On va afficher l’image correspondant au produit.
Transformer le code ainsi :
SIO2
SLAM5 CodeIgniter Tp4
5
L20 : on enlève la catégorie
L21 on crée un tableau rempli à partir d’une boucle
L24 création du chemin d’accès aux images (créer un dossier images sous la racine tp4
avec les fichiers jpeg)
Tester :
2 – Liste déroulante dynamique
On va mettre en place une liste déroulante dynamique (liste des catégories) pour
choisir un élément et afficher dans un formulaire le résultat (les fleurs
correspondantes).
Ajouter dans le menu à gauche des pages (vue1Tp4 et vue2Tp4Select) un nouvel
item :
echo anchor('controleurTp4/choixformdyn','ListeDyn','Lister une table');
echo br();
Définir la nouvelle méthode choixformdyn() dans le controleur :
public function choixformdyn() {
$tab['result']=$this->tp4_model->readallcat();
$this->load->view('vue3Tp4choixformdyn',$tab);
}
Cette méthode appelle une méthode du modèle readallcat() pour obtenir toutes les catégories
et charge la vue vue3Tp4choixformdyn pour afficher le contenu de la liste déroulante.
SIO2
SLAM5 CodeIgniter Tp4
6
Dans le modèle, rajouter la méthode readallcat() :
public function readallcat() {
// $rs=$this->db->get('categorie');
ou
$rs=$this->db->query('select * from categorie');
return $rs->result_array() ;
}
Créer la vue vue3Tp4choixformdyn.php :
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<link rel='stylesheet' href="<?php echo base_url(); ?>/css/style.css" />
<title>Mavue</title>
</head>
<body>
<div id="pagewidth" >
<div id="header"><h1>Codeigniter-Tp4-BD-MVC</h1></div>
<div id="maincol"><h2>Formulaire avec contrôle cbo dynamique</h2>
<?php
echo form_open('controleurTp4/listeform');
echo form_label('Catégorie : ');
$options = array();
for($i=0;$i<=count($result)-1;$i++)
{
$cle = $result[$i]['codecat'];
$options[$cle] = $result[$i]['libcat'];
}
echo form_dropdown('lstcat', $options);
echo br(2);
echo form_submit('cmdvalider','Valider');
echo form_reset('cmdAnnuler','Annuler');
echo form_close();
?>
</div>
<div id="leftcol"> <h2>Menu</h2>
<?php
echo anchor('controleurTp4/index','Accueil','Retour à l\'accueil');
echo br();
echo anchor('controleurTp4/listetable','Select','Lister une table');
echo br();
echo anchor('controleurTp4/choixformdyn','ListeDyn','Lister une table');
echo br();
?>
</div>
</div>
SIO2
SLAM5 CodeIgniter Tp4
7
</body>
</html>
Mise en place d’un formulaire avec la liste déroulante et deux boutons de commande.
Il reste à définir la méthode listeform() dans le contrôleur :
public function listeform() {
$lst = $this->input->post('lstcat'); // récupération de la valeur choisie dans la LD
$tab['result']=$this->tp4_model->rechpdts($this->input->post('lstcat')); // recherche des
produits correspondants à la catégorie
$this->load->view('vue2Tp4Select',$tab);
}
Et enfin définir la méthode rechpdts() paramétrée par le code catégorie dans le
modèle :
public function rechpdts($cat) {
$rs = $this->db->get_where('produit', array('catpdt' => $cat));
// ou $rs=$this->db->query('select * from produit where catpdt=\'' . $cat . '\'');
return $rs->result_array();
}
Tester :
Valider :
SIO2
SLAM5 CodeIgniter Tp4
8
3 – Lien hypertexte dynamique
Ajouter un nouvel item dans le menu à gauche dans chaque vue :
echo anchor('controleurTp4/liendyn','Lien Dyn','Lister une table');
echo br();
Définir la méthode liendyn() dans le controleur :
public function liendyn() {
$tab['result']=$this->tp4_model->readall();
$this->load->view('vue4Tp4liendyn',$tab);
}
Cette méthode récupère l’ensemble des produits, puis charge la vue vue4Tp4liendyn pour
afficher un lien hypettexte pour chaque produit.
Créer la vue vue4Tp4liendyn.php :
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<link rel='stylesheet' href="<?php echo base_url(); ?>/css/style.css" />
<title>Mavue</title>
</head>
<body>
<div id="pagewidth" >
<div id="header"><h1>Codeigniter-Tp4-BD-MVC</h1></div>
<div id="maincol"><h2>Affichage du resultat d'une requete : Lien dynamique</h2>
<?php
$data = array();
for($i=0;$i<=count($result)-1;$i++)
{
$data[] = anchor('controleurTp4/modification',$result[$i]['libpdt']);
}
echo ul($data);
?>
</div>
<div id="leftcol"> <h2>Menu</h2>
<?php
echo anchor('controleurTp4/index','Accueil','Retour à l\'accueil');
echo br();
...
</html>
Le tableau $data est construit à partir des produits, ses éléments sont des liens hypertextes
(désignation du produit) affichés dans une liste à puce (non ordonnée : ul).
SIO2
SLAM5 CodeIgniter Tp4
9
Tester :
Définir la méthode modification() dans le controleur. Cette méthode va rechercher les
caractéristiques du produit sélectionné et les afficher dans une nouvelle vue :
public function modification() {
$tab['produit']=$this->tp4_model->rechpdt();
$this->load->view('vue5Tp4formModif',$tab);
}
La méthode rechpdt() permet de retrouver les caractéristiques d’un produit passé en
paramètre, mais lequel ? (voir plus loin)
Ecrire la méthode rechpdt() dans le modèle :
public function rechpdt($id) {
$rs = $this->db->get_where('produit', array('codepdt' => $id));
//$rs=$this->db->query('select * from produit where codepdt=\'' . $id . '\'');
return $rs->row_array(); // Et non, result_array car une seule ligne de résultat
}
Le paramètre formel est $id.
Tester en sélectionnant un lien, en bas apparait une uri :
…/Tp4/index.php/controleurTp4/modification mais sans paramètre
SIO2
SLAM5 CodeIgniter Tp4
10
Il faut passer la valeur du code du produit sélectionné à la méthode rechpdt().
Dans la vue vue4Tp4liendyn.php, compléter ainsi le lien :
$data[] = anchor('controleurTp4/modification/'.$result[$i]['codepdt'],$result[$i]['libpdt']);
En testant à nouveau, la valeur du code produit apparait dans l’uri (3ième segment de l’uri en
partant de la racine tp4) :
Modifier la méthode modification dans le controleur :
$tab['produit']=$this->tp4_model->rechpdt($this->uri->segment('3'));
Créer la vue vue5Tp4formModif.php :
Tester :
SIO2
SLAM5 CodeIgniter Tp4
11
