Vérifier des valeurs ciblées dans une grille de données

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : Vérifier des valeurs ciblées dans une grille de données

Re: Vérifier des valeurs ciblées dans une grille de données

par libertux » 20 mars 2014, 21:48

Bonjour,
Ayant plusieurs engagement je ne peut malheureusement finir le tutoriel que j'ai promis ces jours ci mais voila une démarche détaillé de l'idée du plugin.

GÉNÉRER LA GRILLE:

Je suppose que t'as déjà travaillé dessus, mais j'ai quelques recommandations :
- ajouter une classe "input-sudk" aux imputs de la grille.
- ajouter des attributs HTML5 pour marquer les lignes, les colonnes et les sous grilles.
Par exemple, tout les éléments de la ligne "X" aurons un attribut (data-ligne="LX") et une classe "LX", les inputs de la colonne "Y" aurons un attribut (data-colone="CY") et une classe "CY"
pour les sous grilles c'est les 9 cellules qui ne doivent pas avoir le même chiffre (principe du sudoku) chaque input de le sous grille Z aurons un attribut (data-st="STZ") et une classe "STZ" bon voila le code PHP qui génère une grille avec ce principe mais il faut implémenté aussi cette logique dans ton fichier 'gen_grille.php':

include 'gen_grille.php'; // On prend en compte les données du fichier gen_grille.php

echo '<table width="200" border="1" style="border-style:solid;">';// On ouvre le tableau (la grille)
         
        for ($i=0;$i<sizeof($Grille[0]);$i++){ // tant que tu n'a pas atteint la fin de Grille[0], soit 9 lignes, crée un <TR>                
                        echo '<tr>';
                                  $k = 0;     
                                for ($j=0;$j<sizeof($Grille[0]);$j++){// Pour chaque TR ouvert, tant que tu n'a pas atteint la fin de Grille[0], soit 9 lignes, crée un <TD>
                                                                                                                        // Ce qui va créer 9 colonnes pour chacune des 9 lignes (et donc faire une grille de 9/9)
                                        $choix2 = array_pop($choix);// Pour chaque cellule que tu ouvres prend la dernière valeur de $choix (qui se trouve dans gen_grille.php) et stock-la dans $choix2
                                       

                                        if ($i==2 || $i==5){ // si tu es à la 3 OU à la 6 ligne ([2] OU [5])
                                                echo '<td style="border-bottom : 4px solid blue;" >';// mets une bordure bleu de 4px en bas de la cellule
                                               
                                        }
                                        elseif ($j==2 || $j==5){// sinon si tu es à la colonne 3 OU la colone 6
                                                        echo '<td style="border-right : 4px solid blue;">';// mets une bordure bleu de 4px sur le coté droit
                                        }
                                        elseif ($i==2 && $j==5) {
                                                        echo '<td style="border-right : 4px solid blue; border-bottom : 4px solid blue;">';
                                        }
                                        else{
                                                echo '<td>';
                                        }

                                        if (empty($choix)) {// Si $choix est vide, alors affiche que c'est vide)
                                                                echo 'vide';
                                        }
                                        else{ // Sinon, si $choix a encore une valeur, fait ça :
                                                                               
                                                if($choix2==1){ // si la valeur choisie et stockée dans $choix2 = "1"
                                                                echo  $Grille[$j][$i] ;// alors affiche moi la valeur de Grille[n°colonne où tu es][n°ligne où tu es]
                                                }
                                                else{
                                                                echo '<input type="text" data-ligne="L'.$i.'" data-colone="C'.$j.'" data-st="ST'.$k.'" name="'.$j.'-'.$i.'" id="'.$j.'-'.$i.'" maxlength="1" size="1" class="input-sudk L'.$i.' C'.$j.' ST'.$k.' ">';
                                                                        // sinon, tu affiches un champs input pour que l'utilisateur le remplisse
                                                }


                                                echo '</td>';
                                        }      
									
									

									if(($j-1) == sizeof($Grille[0]))){
										
										
										$k=0;
									}else{
									
										if(fmod($i,3) == 0){
										
											$k++;
										
										}
									
									}
										
                                                                       
                                }      
                       
                        echo "</tr>";  
        }
       
echo "</table>";
une foi les modifications implémentés voila le code JQuery qui vas avec:

[javascript]


$(document).ready(function() {

$( ".input-sudk" ).change(function() {
// Check input( $( this ).val() ) for validity here

var valeur = $( this ).val();
var ligne = $(this).data('ligne');
var col = $(this).data('colone');
var st = $(this).data('st');

//vérification sur la ligne
//val par défaut, on suppose que le nombre entré n'existe ni dans la ligne ni dans la colonne ni dans le sous tableau
var inline = False;
var incolomn = False;
var insubgrid = False;

$("."+ligne).each(function(){
//si le imput selectionné != du actuel on vérifie par l'attribut colonne car on ne trouve jamais une cellule ayant la même ligne et colonne!!
if($(this).data('colone') != col){
if($( this ).val() == valeur){ inline = TRUE; }
}
});

//ON FAIT DE MÊME POUR LES COLONNES ET LES SOUS TABLEAUX


//ici on vérifie les nouveaux valeurs de inline, incolomn et insubgrid et on fait ce qui doit être fait.

if(inline){...}
if(incolomn){...}
if(insubgrid){...}
});

});


[/javascript]

voila c'est l'idée que j'ai eu sur le sujet,

Bon Codage

Re: Vérifier des valeurs ciblées dans une grille de données

par libertux » 13 mars 2014, 20:55

salut mon ami, je n'est pas oublier de t'aider, je rédige un tuto sur ton projet intituler "faire un sudoku avec JQuer pas à pas" il sera publier dans mon blog ultérieurement car en fait c'est un bon sujet de tutoriel en plus si on entame une discutions ici ça vas prendre plusieurs pages et que personne ne pourra suivre parfaitement l'évolution du sujet.

Bon Codage

Re: Vérifier des valeurs ciblées dans une grille de données

par Mousshaker » 04 mars 2014, 13:03

Bonsoir,
Je conseille d'utilisé un tableau multi-dimentionel dans le quel il y a les valeurs de la grille et vérifier dynamiquement si la valeur d'une cellule existe déjà dans la ligne ou dans la colonne.

bon codage
Oui c'est tout à fait ce que je souhaite faire, mais mon soucis c'est de savoir comment faire ça justement.
C'est là où je plante :priere:

Re: Vérifier des valeurs ciblées dans une grille de données

par libertux » 28 févr. 2014, 18:42

Bonsoir,
Je conseille d'utilisé un tableau multi-dimentionel dans le quel il y a les valeurs de la grille et vérifier dynamiquement si la valeur d'une cellule existe déjà dans la ligne ou dans la colonne.

bon codage

Vérifier des valeurs ciblées dans une grille de données

par Mousshaker » 28 févr. 2014, 12:21

Bonjour à vous

En cherchant à réaliser un sudoku pour m'entrainer, je me retrouve confronté à blocage.
En effet, après réussi à générer une grille de numéros, avec certains numéro affichés, et pour le reste des champs inuput, pour que l'utilisateur les remplisse lui-même, j'aimerai pouvoir vérifier, lorsque l'utilisateur entre une valeur, que cette valeur n'existe pas déjà dans la colonne et dans la ligne où il se situe (qu'elle n'est pas déjà affichée, ou qu'elle n'ait pas déjà été entrée).

Pour mieux comprendre, j'ai joint une image reprenant ma grille.

Supposons donc que je me trouve en cellule 4-5.
j'ai déjà entré la valeur 2 en cellule 1-5
Je voudrais donc que lorsque j'aurai entré une valeur en cellule 4-5 (mettons la valeur 6), ca me vérifie que 6 n'existe pas déjà dans toute la colonne j5 (de 0-5 à 8-5) et dans toute la ligne i4 (de 4-0 à 4-8)
Pour ca il me faut utiliser du javascript en AJAX, à ce que j'ai cru comprendre
Sauf que je ne connais pas ce langage.

Quel code je pourrais appliquer pour cette vérification ?

Pour information, voici le code de ma grille générée :
include 'gen_grille.php'; // On prend en compte les données du fichier gen_grille.php

echo '<table width="200" border="1" style="border-style:solid;">';// On ouvre le tableau (la grille)
	 
	for ($i=0;$i<sizeof($Grille[0]);$i++){ // tant que tu n'a pas atteint la fin de Grille[0], soit 9 lignes, crée un <TR>			
			echo "<tr>";
					
				for ($j=0;$j<sizeof($Grille[0]);$j++){// Pour chaque TR ouvert, tant que tu n'a pas atteint la fin de Grille[0], soit 9 lignes, crée un <TD>
															// Ce qui va créer 9 colonnes pour chacune des 9 lignes (et donc faire une grille de 9/9)
					$choix2 = array_pop($choix);// Pour chaque cellule que tu ouvres prend la dernière valeur de $choix (qui se trouve dans gen_grille.php) et stock-la dans $choix2
					

					if ($i==2 || $i==5){ // si tu es à la 3 OU à la 6 ligne ([2] OU [5])
						echo '<td style="border-bottom : 4px solid blue;">';// mets une bordure bleu de 4px en bas de la cellule
						
					}
					elseif ($j==2 || $j==5){// sinon si tu es à la colonne 3 OU la colone 6
							echo '<td style="border-right : 4px solid blue;">';// mets une bordure bleu de 4px sur le coté droit
					}
					elseif ($i==2 && $j==5) {
							echo '<td style="border-right : 4px solid blue; border-bottom : 4px solid blue;">';
					}
					else{
						echo '<td>';
					}

					if (empty($choix)) {// Si $choix est vide, alors affiche que c'est vide)
								echo 'vide';
					}
					else{ // Sinon, si $choix a encore une valeur, fait ça :
										
						if($choix2==1){	// si la valeur choisie et stockée dans $choix2 = "1"
								echo  $Grille[$j][$i] ;// alors affiche moi la valeur de Grille[n°colonne où tu es][n°ligne où tu es]
						}
						else{
								echo '<input type="text" name="'.$j.'-'.$i.'" id="'.$j.'-'.$i.'" maxlength="1" size="1" class="">';
									// sinon, tu affiches un champs input pour que l'utilisateur le remplisse
						}


						echo '</td>';
					}			
									
				}	
			
			echo "</tr>";	
	}
	
echo "</table>";
A noter :
$choix est une array qui se situe dans gen_grille.php et qui renvoie aléatoirement 1 ou 0
En fonction de la valeur, cela permet soit d'afficher le numéro qui correspond dans $Grille[][], soit d'afficher un input

$Grille est un array à double entrée qui se situe aussi dans gen_grille.php et qui permet de générer ma table "source" de chiffres aléatoire

En espérant avoir été clair, sinon n'hésitez pas à me demander des précisions :)

Merci de votre aide