Récupération valeur select impossible dans include multiple

**keitaro_bzh** · 11/01/2017, 17h29

Bonjour à tous,

Voila, je débute dans la programmation et je suis en train de me faire une petite appli HTML/CSS/PHP/JS.
Je m'arrache les cheveux, mais pour le moment, ça va, je trouve toujours une issue, sauf la.
Je possède trois fichiers
Le premier correspond à mon tableau de données issues d'une base MYSQL. Je raccourcis volontairement le*code pour expliquer le problème. Ce fichier est un fichier type qui correspond à une classe créé (ici une Personne). Ce fichier fait office d'un include dans un fichier index.php avec une inclusion d'un header.php et d'un footer.php. On va l'appeler personne_tableau.php et le code est le suivant:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<p class="row col-xs-12">
	<div class="col-xs-6 ">
		<label for="affiche">Filtre : </label>
		<select name="affiche" id="affiche" class="pull-left form-control">
			<option value="1">Actifs</option>
			<option value="0">Archivés</option>
			<option value="-1">Tous</option>
		</select>
	</div>
</p>
 
<p id="tableau" class="col-xs-12">
 
</p>
 
<!--  On va créer notre fonction de scripts qui réagit au bandeau de recherche -->
<script>
$(function() {
        $('#numPage').change(function() {
                $('#tableau').html('<div class="center"><img src="http://www.mediaforma.com/sdz/jquery/ajax-loader.gif"></div>');
                $('#tableau').load('/personne.php',
                                {       fonction: 'createTableau',
                                        affiche: $('#affiche').val(), 
                                        page: $('#numPage').val()
        });
        $('#affiche').change(function() {
                $('#tableau').html('<div class="center"><img src="http://www.mediaforma.com/sdz/jquery/ajax-loader.gif"></div>');
                $('#tableau').load('personne.php',
                                {       fonction: 'createTableau',
                                        affiche: $('#affiche').val(), 
                                        page: '1'
        });
        // Fonction qui va affiche le tableau au chargement du programme
        $(document).ready(function() {
                $('#tableau').html('<div class="center"><img src="http://www.mediaforma.com/sdz/jquery/ajax-loader.gif"></div>');
                $('#tableau').load('personne.php',
                                {       fonction: 'createTableau',
                                        affiche: $('#affiche').val(), 
                                        page: '1'
        });
});
</script>

Le script personne.php lui va surveiller l'action et vérifier ce qu'il doit faire (afficher le tableau des données, le formulaire de saisie, enregistrer les données. Le code est le suivant:

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<?php 
 
/* Variable à renseigner pour éviter les erreurs de chemin relatif/absolu
 * qui accède au fichier de configuration en particulier
 */
$GLOBALS['documentRoot'] = '../../../';
 
/* On vérifie si une fonction est appelé par notre script jquery
 * et l'on va chercher la fonction correspondante
 */
if (isset($_POST['fonction'])) {
	switch ($_POST['fonction']) {
		case 'createTableau':
			createTableauObjet();
			break;
	}
}
 
function createTableauObjet() {
	// on va ajouter notre classe
	include_once ($GLOBALS['documentRoot'] .'_default/class/Personne.php');
	$monObjet = new Personne();
 
	// On va préparer notre tableau de variables pour récupérer les données
	$tableauDonnees = array(
			'classe' => 'Personne',
			'afficheArchive' => $_POST['affiche'],
			'pageAffiche' => $_POST['page']
	);
 
	/* On va récupérer notre liste d'objet et préparer notre
	 * tableau de paramètre à envoyer à notre fonction
	 */
	$maListeObjet = $monObjet->getListeRequeteID($tableauDonnees);
	$tableauAffiche = array (
			'definition' => $monObjet->getDefinition('tableau'),
			'listeObjet' => $maListeObjet['donnees'],
			'nombreParPage' => $_POST['nombre'],
			'nombreResultat' => $maListeObjet['nbResultat'],
			'urlPage' => 'index.php?module=referentiel&option=personnes&action=modif&id=',
			'presenceRupture' => false,
			'champRupture' => null
	);
 
	// On créé le tableau que l'on affiche sur la page
	include_once ($GLOBALS['documentRoot'] . '_default/fonctions/tableau.php';
	createTableau($tableauAffiche);
}

Enfin, comme le dit la dernière ligne de mon fichier personne.php, il va utiliser une fonction qui va me créer le tableau mis en forme en fonction des données que je vais lui envoyer. la code du fichier tableau.php est le suivant:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
function createTableau($args) {	
	/* On va créer une fonction qui affiche le nombre de page
	* On calcule le nombre de page
	*/
	if ((int)$args['nombreParPage'] !== 0) {
		if (((int)$args['nombreResultat'] % (int)$args['nombreParPage']) !== '0') {
			$nbPage = (int)((int)$args['nombreResultat'] / (int)$args['nombreParPage']) +1;
		} else {
			$nbPage = (int)((int)$args['nombreResultat'] / (int)$args['nombreParPage']);
		}
	}
	else {
		$nbPage = '1';
	}
	?>
		<div class='pull-right'>
			Page : 
			<SELECT id="numPage">
			<?php           
                        for($i = 1 ; $i <= $nbPage; $i++) { ?>
				<option value="<?php echo $i; ?>"><?php echo $i; ?></option> 
			<?php }
                
                        ?>
			</SELECT>
		</div>
	<table class="table table-bordered table-striped table-condensed">
		<tr>
		<?php 
                // On va créer notre en-tête
                foreach ($args['definition'] as $valeur) {
                        if ($valeur['afficheTableau']){ ?>
				<th align=center><?php echo strtoupper($valeur['nomAfficheTableau']); ?></th>
			<?php }
                } ?>
			<th>OPTIONS</th>
		</tr>
		<?php
                // On va afficher les champs de notre tableau en fonction de notre en-Tete
                foreach($args['listeObjet'] as $ligne) {
                        foreach ($args['definition'] as $cle => $valeur) {
                                if ($valeur['afficheTableau']) { ?>
					<td><?php echo $ligne->getValeur($cle); ?></td>
				<?php }
                        }
                        // Oa va afficher nos options
                        ?>
			<td align=center><a href="<?php echo $args['urlPage'] . $ligne->getValeur($ligne->getValeur('nomID')); ?>"><span class="glyphicon glyphicon-search"></span></a></td>
			<?php 
                // On ferme notre ligne
                ?></tr><?php
                } ?>
	</table>
	<?php 
}

Donc, l'affichage de la page se fait bien. J'ai mon tableau qui fonctionne correctement. Mon filtre sur les actifs/inactifs fonctionne à merveille (j'ai d'autres filtres sur mon fichier qui fonctionnent parfaitement et dont j'en suis fier vu mon niveau. :p).
A l'affichage, j'ai bien au dessus de mon tableau le nombre de page correspondant à mon nombre d'entrée demandée (un autre filtre que j'ai squeezé). Par contre, quand je sélectionne mon numéro de page, rien ne se passe. J'ai fait un bête alert('test') à la selection du champ, mais rien. Du coup, cela ne fonctionne pas.
J'ai affiché le code source de la page et dans celui-ci, j'ai uniquement le code du fichier personne_tableau.php. A aucun moment, je ne vois la construction de mon tableau en html. Il ne connaît donc pas mon select. Mais comment je peux faire pour récupérer cette info?
J'ai la solution de mettre le nombre de page dans mon fichier personne_tableau.php, mais à ce moment, je n'ai encore effectué aucun filtre et cela m'oblige à faire plusieurs appels à la base de données, enfin je trouve la démarche lourde.
Je suis sur qu'il existe une solution plus simple (je ne suis pas encore au niveau d'utiliser un framework), qui quand je la verrai me donnera envie de me pendre tellement c'était simple, mais j'avoue sécher la.
J'essaie de faire des fonctions génériques pour pouvoir les réutiliser dans le reste de l'application en ne modifiant que quelques paramètres. Et je voudrais que mon tableau.php soit le même dès que j'affiche un tableau.
J'espère avoir été clair car j'ai l'esprit un peu tordu et les méninges qui bouillonnent en ce moment.. :p

D'avance merci

**Loralina** · 12/01/2017, 01h06

Bonsoir,

Par contre, quand je sélectionne mon numéro de page, rien ne se passe.

Je ne fais pas de jQuery, mais je vois peut-être où est l'erreur :
Ici :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('#numPage').change(function() {

Vous définissez une fonctionnalité sur une liste déroulante qui n'existe pas encore.

En effet, elle est créée suite à l'appel de la fonction "load" (je suppose que c'est de l'Ajax) une fois le fichier personne.php chargé.
Une solution serait de définir une fonction "callback" appelée une fois le "load" achevé, et dans cette fonction placer le code ci-dessus.

J'ai affiché le code source de la page et dans celui-ci, j'ai uniquement le code du fichier personne_tableau.php. A aucun moment, je ne vois la construction de mon tableau en html. Il ne connaît donc pas mon select. Mais comment je peux faire pour récupérer cette info?

Avec un clic droit sur un élément de la page, vous devriez avoir une option du style "inspecter/examiner l'élément".

**keitaro_bzh** · 12/01/2017, 12h02

Merci pour ta réponse. Cela confirme ce que je pensais.
J'ai donc créé ma fonction callback comme conseillé (code ci-dessous)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<script>
function callback() {
	$('#numPage').change(function() {
		$('#tableau').html('<div class="center"><img src="http://www.mediaforma.com/sdz/jquery/ajax-loader.gif"></div>');
		$('#tableau').load('/personne.php',
				{	fonction: 'createTableau',
					affiche: $('#affiche').val(), 
					page: $('#numPage').val()
	});
}
$(function() {
	$('#affiche').change(function() {
		$('#tableau').html('<div class="center"><img src="http://www.mediaforma.com/sdz/jquery/ajax-loader.gif"></div>');
		$('#tableau').load('personne.php',
				{	fonction: 'createTableau',
					affiche: $('#affiche').val(), 
					page: '1'
                }
	});
	// Fonction qui va affiche le tableau au chargement du programme
	$(document).ready(function() {
		$('#tableau').html('<div class="center"><img src="http://www.mediaforma.com/sdz/jquery/ajax-loader.gif"></div>');
		$('#tableau').load('personne.php',
				{	fonction: 'createTableau',
					affiche: $('#affiche').val(), 
					page: '1'
                }
                callback();
	});
});
</script>

Par contre, rien ne se passe. Pourtant, si je rajoute un alert() avant mon "$('#numPage').change(function()". ça fonctionne mais, une seule fois

.
Je suis sur la voie, mais il me manque encore une subtilité. Je pense que tout simplement, ma fonction callback n'est pas appelé nulle part..

**Loralina** · 12/01/2017, 12h58

Bonjour,
Il me semble qu'il y a des problèmes dans les paires de parenthèses et d'accolades.
Ensuite, la fonction doit être appelée à chaque fois que la liste est régénérée (ou alors il faudrait ne pas la recréer entièrement à chaque fois, à voir pour améliorer cela dans un second temps).
Plutôt comme ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<script>
function callback() {
	$('#numPage').change(function() {
		$('#tableau').html('<div class="center"><img src="http://www.mediaforma.com/sdz/jquery/ajax-loader.gif"></div>');
		$('#tableau').load('/personne.php',{fonction:'createTableau',affiche:$('#affiche').val(),page:$('#numPage').val()},callback);
	});
}
$(function() {
	$('#affiche').change(function() {
		$('#tableau').html('<div class="center"><img src="http://www.mediaforma.com/sdz/jquery/ajax-loader.gif"></div>');
		$('#tableau').load('personne.php',{fonction:'createTableau',affiche:$('#affiche').val(),page:'1'},callback);
	});
	// Fonction qui va affiche le tableau au chargement du programme
	$(document).ready(function() {
		$('#tableau').html('<div class="center"><img src="http://www.mediaforma.com/sdz/jquery/ajax-loader.gif"></div>');
		$('#tableau').load('personne.php',{fonction:'createTableau',affiche:$('#affiche').val(),page:'1'},callback);
	});
});
</script>

**keitaro_bzh** · 12/01/2017, 16h36

Merci Loralina pour ton aide.

C'était bien un problème d'emplacement d'appel à ma fonction callback associé à un problème de parenthèse (je vais me flageller 10fois pour cet oubli stupide lol).

Ca fonctionne comme un charme

.

Je sens que je vais pouvoir faire pleins de fonctionnalités puissantes avec tout ça.

Pour ne pas recharger à chaque fois, il faudrait que je transforme mon tableau d'objet PHP et le renvoyer au format JSON pour que ce soit JavaScript qui le gère? Mais on s'égare la. Milles merci en tout cas

Récupération valeur select impossible dans include multiple

jQuery

Vue hybride

Discussions similaires

Partager

Partager