begin process at 2012 05 29 02:56:58
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

CSS

 > 

Général

 > 

appel de fonction javascript qui ne marche qu'une fois...


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

appel de fonction javascript qui ne marche qu'une fois...

mercredi 16 juin 2010 à 14:10:26 | appel de fonction javascript qui ne marche qu'une fois...

sebshiva

Bonjour à tous!

Je vous soumets un problème sur lequel je m'arrache les cheveux depuis hier.

J'ai trois petites fonctions JS qui me permettent de mettre à jour des input type="select".

Je vous les donne au passage (vos remarques les concernant sont les bienvenues)

Code Javascript :
function insertNewOption(selectElement, newOption) {
	var optsLen = $(selectElement).options.length;
	$(selectElement).options[optsLen] = newOption;
	return optsLen;
}

function removeOption(selectId, optionValue) {
	var oOptions = $(selectId).getElementsByTagName('option');
	var taille = oOptions.length;
	for(i=0; i < taille; i++) { 
		if (oOptions[i].value == optionValue) {
			Element.remove(oOptions[i]);
			throw $break;
		}
	}
}

function updateOption(selectId, optionValue, optionNewText) {
	var oOptions = $(selectId).getElementsByTagName('option');
	var taille = oOptions.length;
	for(i=0; i < taille; i++) { 
		if (oOptions[i].value == optionValue) {
			oOptions[i].text = optionNewText;
			throw $break;
		}
	}
}


Dans mon HTML, j'ai un form, et trois zones :
Une pour modifier un dossier (c'est une petite messagerie interne)
un input pour ajouter un dossier, un select pour renommer un dossier et un select pour supprimer un dossier.
Un input type="button" est associé à chacune de ces zones, surveillé par un Event.observe.
dans mon traitement Ajax :
Code Javascript :
switch($_POST['sFolderAction']) {
	case 'new':
		$idNewFolder = MessageFolder::newFolder($idUser, $_POST['sFolderName']);
		if (!empty($idNewFolder)) {
			echo 'Le dossier ', $_POST['sFolderName'], ' a été créé.';
			?>
			<script type="text/javascript">
		   		insertNewOption(
				   		'selectFolderUpdate', 
				   		new Option("<?php echo $_POST['sFolderName']; ?>", "<?php echo $idNewFolder; ?>"));
		   		insertNewOption(
				   		'selectFolderDelete', 
				   		new Option("<?php echo $_POST['sFolderName']; ?>", "<?php echo $idNewFolder; ?>"));
			</script>
			<?php
		}
		break;
	case 'update':
		if (MessageFolder::updateFolder($_POST['idFolder'], $_POST['sFolderName'])) {
			echo 'Le dossier ', $_POST['sFolderName'], ' a bien été renommé.';
			?>
			<script type="text/javascript">
				updateOption(
					'selectFolderUpdate', 
					'<?php echo $_POST['idFolder']; ?>', 
					'<?php echo $_POST['sFolderName']; ?>'
				);
				updateOption(
					'selectFolderDelete', 
					'<?php echo $_POST['idFolder']; ?>', 
					'<?php echo $_POST['sFolderName']; ?>'
				);
			</script>
			<?php
		}
		break;
	case 'delete':
		$sFolderName = MessageFolder::getFolderName($_POST['idFolder']);
		MessageFolder::deleteFolder($_POST['idFolder']);
		echo 'Le dossier ', $sFolderName, ' a été supprimé.';
		?>
		<script type="text/javascript">
			removeOption(
				'selectFolderUpdate', 
				'<?php echo $_POST['idFolder']; ?>'
			);
			removeOption(
				'selectFolderDelete', 
				'<?php echo $_POST['idFolder']; ?>'
			);
		</script>
		<?php
		break;
	}


(oui, il y a un peu de php aussi...)

La réponse ajax :

Code Javascript :
Le dossier testInsert$$ a bien été renommé.			<script type="text/javascript">
				updateOption(
					'selectFolderUpdate', 
					'4', 
					'testInsert$$'
				);
				updateOption(
					'selectFolderDelete', 
					'4', 
					'testInsert$$'
				);
			</script>


à priori, tout va bien....
Sauf que seul un select (le premier dans le DOM) est mis-à-jour....

Et si j'isole l'un ou l'autre, ça fonctionne.
Donc sémantiquement, mon html est bon, mon code JS aussi et pas de souci côté PHP....

Quelqu'un aurait une idée?

D'avance merci pour vos lumières et autres remarques.
mercredi 16 juin 2010 à 14:12:45 | Re : appel de fonction javascript qui ne marche qu'une fois...

sebshiva

oups....
Je vois "Thème : CSS / Général"
Désolé pour le mauvais emplacement de mon post.
mercredi 16 juin 2010 à 18:18:46 | Re : appel de fonction javascript qui ne marche qu'une fois...

PetoleTeam

Membre Club
Bonjour,
sans regarder le code, il semblerait que tu ais la même ID et/ou NAME pour tes deux SELECTs (input type="select" ???)

;O)
mercredi 16 juin 2010 à 18:31:16 | Re : appel de fonction javascript qui ne marche qu'une fois...

sebshiva

Bonjour!

Non, ils ont pour id : "selectFolderUpdate" & "selectFolderDelete".
Merci de ta suggestion en tous cas! :)
mercredi 16 juin 2010 à 18:35:10 | Re : appel de fonction javascript qui ne marche qu'une fois...

sebshiva

Voici le HTML ainsi que les appels Ajax si ça peut aider :

Code HTML :
<div id="divFolderManager">
	<h2>Gestion des dossiers</h2>
	<hr class="white" />
	<br />
	<span id="msgFolderManagerNotification"></span>
	<br />
	<br />
	<form action="#" id="msgFolderManagerForm">
		<span id="newFolderSpan" class="folderManagerSpan">
			<label for="newFolderInuput">
				Créer un nouveau dossier
			</label>
			<input type="text" id="newFolderInput" />
			<input type="button" id="newFolderSubmit" value="Créer" />	
		</span>
		<hr class="grey" />
		<span id="folderUpdateSpan" class="folderManagerSpan">
			<label for="selectFolderUpdate">
				Renommer le dossier
			</label>
			{__SELECT_FOLDER_UPDATE__}
			<label for="updateFolderInput">
				pour
			</label>
			<input type="text" id="updateFolderInput" />
			<input type="button" id="updateFolderSubmit" value="Enregistrer" />	
		</span>
		<hr class="grey" />
		<span id="folderDeleteSpan">
			<label for="selectFolderDelete">
				Supprimer le dossier
			</label>
			{__SELECT_FOLDER_DELETE__}
			<input type="button" id="deleteFolderSubmit" value="Supprimer" />
			Attention !
			<br />
			Cette action supprimera tous les messages contenus dans ce dossier.
		</span>
	</form>
	<br />
	<br />
</div>
<script type="text/javascript">
new Event.observe("newFolderSubmit","click", function(evt) {
	new Ajax.Updater('msgFolderManagerNotification', "{__AJAX_PATH__}msgFolderManager.ajax.php", {
		method : 'post',
		parameters : "sFolderAction=new&sFolderName="+ $('newFolderInput').value,
		evalScripts : true,
		onSuccess : function() {
			$('newFolderInput').value = '';
		}
	});
});
new Event.observe("selectFolderUpdate","change", function(evt) {
	$("updateFolderInput").value = $("selectFolderUpdate").options[$("selectFolderUpdate").selectedIndex].text;
	$("updateFolderInput").focus();
});
new Event.observe("updateFolderSubmit","click", function(evt) {
	new Ajax.Updater('msgFolderManagerNotification', "{__AJAX_PATH__}msgFolderManager.ajax.php", {
		method : 'post',
		parameters : "sFolderAction=update&idFolder="+ $('selectFolderUpdate').value + "&sFolderName=" + $('updateFolderInput').value,
		evalScripts : true,
		onSuccess : function() {
			$('updateFolderInput').value = '';
			$('selectFolderUpdate').value = '';
		}
	});
});
new Event.observe("deleteFolderSubmit","click", function(evt) {
	new Ajax.Updater('msgFolderManagerNotification', "{__AJAX_PATH__}msgFolderManager.ajax.php", {
		method : 'post',
		parameters : "sFolderAction=delete&idFolder="+ $('selectFolderDelete').value,
		evalScripts : true,
		onSuccess : function() {
			$('selectFolderDelete').value = '';
		}
	});
});
</script>


C'est un template hein....
mercredi 16 juin 2010 à 18:57:48 | Re : appel de fonction javascript qui ne marche qu'une fois...

PetoleTeam

Membre Club
difficile de t'aider, je ne connais pas cette libraire...

;O)
mercredi 16 juin 2010 à 19:06:33 | Re : appel de fonction javascript qui ne marche qu'une fois...

sebshiva

C'est prototype.
Mais merci quand même! :)
mercredi 16 juin 2010 à 21:48:13 | Re : appel de fonction javascript qui ne marche qu'une fois...

PetoleTeam

Membre Club
en regardant rapidement le code peut être un conflit entre l'événement change sur le SELECT "selectFolderUpdate" et le click sur "updateFolderSubmit"

;O)
jeudi 17 juin 2010 à 14:10:54 | Re : appel de fonction javascript qui ne marche qu'une fois...

sebshiva

Réponse acceptée !
@PetoleTeam -> Non....

J'ai trouvé.
Du moins une amie a trouvé.
C'est le throw $break dans les fonctions qui arrêtait le script.
Ça doit lever une exception....
Ce qui a mis sur la piste, c'est dans le cas d'un ajout, les deux select étaient bien mis à jour.
J'ai remplacé ces throw $break (de prototype) par des bons vieux break (JavaScript) et ça fonctionne à merveille.

Un grand merci à toi PetoleTeam dans tous les cas pour le temps que tu auras passé sur mon topic :)
....et à l'amie qui a trouvé surtout :)
jeudi 17 juin 2010 à 18:38:08 | Re : appel de fonction javascript qui ne marche qu'une fois...

PetoleTeam

Membre Club
Bonjour,
MERCI à toi du retour, devenu si rare, je serais moins bête après ce que je viens de lire.

Juste une remarque, si je puis me permettre, pourquoi écrire
Code Javascript :
var oOptions = $(selectId).getElementsByTagName('option');
quand un simple
Code Javascript :
var oOptions = $(selectId).options;
suffit...
mais cela reste anecdotique...
bonne poursuite...
;O)

1 2

Cette discussion est classée dans : code, js, selectfolderupdate, selectfolderdelete, updateoption


Répondre à ce message

Sujets en rapport avec ce message

pb fonction js pour submit de formulaire dynamique [ par BDdev ] HELP !!!!je créé dynamiquement sur une page un tableau contenant les résultats d'une requete sql et dans chaque ligne un formulaire (caché) et je voud erreur JS [ par attentio ] bonjour !j'ai une erreur javascrit dans mon code mais je ne trouve pas ou onclick="document.form_caddy.<? echo $ref ;?&g Reload d'un .js toutes "x" secondes. [ par shadow125 ] Bonsoir à vous tous !Voila j'essaye de faire un petit script et j'ai besoin de le relancer toutes les 1secondes, sans recharger la page.J'ai trouvé co Pb js avec Netscape [ par manueg ] Bonjour à tous, je ne comprends pas pourquoi ce code fonctionne sans pb sous IE alors qu'avec Netscape il ne trouve pas la page que je veux afficher e reconnaitre un ligne de code pour mettre une partie dans l'html et l'autre dans un .js [ par J4Gu4R ] Rebonjour, c'est un peu la suite de mon dernier post. j'ai pleins de petit javascript dans des page html et je voudrais me faire une bibliothèque de besoin JS d'un code pour dynamiser l'affichage [ par kamerlino ] Salut à tous! Quelqu'un n'aurait-il pas un code pour rafraichir dynamiquement le contenu d'une page.? l'idée est de recupérer un lot d'informations da ecire en caractères ARABES dans un fichier javascript .js [ par moha007 ] Bonjourje suis entrain de réaliser un sites multilangues..dans ma page index-ar.html pour mon menu je fais appel à un fichier javascript [code][/code action en js [ par anthonycosson ] Bonjour a tous,voila j'ai un bouton qui fait cette action :[code][/code]et Réinitialiser un OPTION avec du code JS [ par whombat ] Bonjour à tous,J'ai sur ma page HTML et PHP (avec du JS) toute une série de listes déroulantes, une par lettre de l'alphabet.Le visiteur doit choisir Souci avec insersion code JS au sein d'un site Web. [ par youness31 ] Bonsoir tout le monde, Je butte actuellement sur un gros souci qui peut paraitre à nombre d'entre vous très mineur. C'est la première fois que j'utili


Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

Photothèque

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 4,727 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales