Ajax et ajout de checkbox ?

**Borowsky** · 16/06/2008, 15h50

Bonjour, je ne connais pas trop la technologie AJAX et je voudrais avoir quelques renseignements :

Est-il possible de faire une requete SQL en fontion de critères entrés sur une page HTML et d'afficher sur la meme page (sans réactualisation) les résultats de ma requete et des checkbox correspondant a chaque résultats (chaque ligne de ma table trouvée grace a la requete) ??

Et surtout comment en Javascript on peut ajouter des checkbox a une page HTML ?

Merci d'avance !

**IP-Fix** · 16/06/2008, 16h36

Salut.

C'est tout a fait possible en ajax de faire cela.

Pour ajouter une checkbox a ta page web il suffit de faire

Code :

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

1
2
3
var id = 'l id de ton select';
var element = getElementById( id );
element.innerHtml = '...' // ton code html , par exemple ta checkbox ..

Pour assurer la compatibilité avec tout les navigateurs (ou du moins le maximum) je te conseil de passer par un framework.

avec Mootools sa donnerais :

Code :

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

1
2
3
4
var id = 'l id de ton select';
var element = $( id );
var comboBox  = new Element('comboBox', {value: '1', text: 'ton texte'});
element.adopt(comboBox);

exemple complet :

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<script src="mootools12.js" type="text/javascript"></script>
<script type="text/javascript">
window.addEvent('domready', function() {
	var id = 'mySelect';
	var element = $( id );
	var comboBox  = new Element('option', {value: '1', text: 'ton texte'});
	element.adopt(comboBox);
});
</script>
</head>
 
<body>
<select name="" id="mySelect"></select>
</body>
</html>

Tu rajoute une boucle et le tour est joué

On aurait pu aussi créer une combo box de maniere dynamique tout aussi facilement

**Borowsky** · 16/06/2008, 17h02

Merci pour ta réponse, si tu me dis que c'est possible il va falloir que je me penche la dessus alors car je n'ai jamais vraiment programmé en AJAX.

Juste une autre petite question, tres conne surement mais bon je la pose quand meme

Quand tu mets

Code :

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

1
2
3
var id = 'l id de ton select';
var element = getElementById( id );
element.innerHtml = '...' // ton code html , par exemple ta checkbox ..

C'est quoi un select ? car moi je connais que le "select" qui sert a faire des listes en HTML, c'est le meme ?

**E.Bzz** · 16/06/2008, 17h14

Bonjour,

Envoyé par Borowsky

C'est quoi un select ? car moi je connais que le "select" qui sert a faire des listes en HTML, c'est le meme ?

IP-Fix me corrigera quand il se reconnectera si je dis une bêtise sur son code :

Tu peux remplacer "id du select" par "id du conteneur".
En effet dans l'exemple donné, tu pointes sur la balise select pour en modifier le contenu (.innerHTML), en l'occurrence les options.
Si tu dois appliquer le script à des checkbox, tu gardes exactement la même logique, sauf que tu ne vas pas récupérer le résultat dans un select, mais dans un autre type de conteneur (un <div> ou un <p>, par ex.).

Dans ce cas :

Code :

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

1
2
3
var id = 'l id de ton div';
var element = getElementById( id );
element.innerHtml = '...' // ton code html , par exemple ta checkbox ..

A+

**IP-Fix** · 16/06/2008, 19h20

oui c'est le même select mais si tu veux tu peux aussi le faire dans une balise div si tu veux comme le suggère E.Bzz

**Borowsky** · 17/06/2008, 09h02

Merci !

Cependant je viens d'essayer et Firebug m'indique une erreur sur le "$" de la ligne

Code :

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

var element = $(id);

"$ is not defined"... comme si "$" devait etre une variable...

D'ailleurs je ne comprend pas non plus la présence de ce "$".

Je vous l'avais dit je suis tout nouveau dans l'AJAX et le Javascript

Ajax et ajout de checkbox ? [MooTools]

Bibliothèques & Frameworks

Vue hybride

Discussions similaires

Partager

Partager