11540 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Jquery/Ajax et input type hidden

Bonjour !

Mon problème est le suivant :

- J'ai un formulaire qui comprend un champ texte, puis deux autre champ en type Hidden.
- J'envoi les données, et j'ai uniquement la valeur du champ texte qui est récupéré, donc erreur du php pour insérer la ligne dans la base de donnée.

Exemple :

J'utilise ce genre de methode JS pour récupérer les données des champs : 


	$("#submit").live("click", function(){
		var id_user = $('#id_user').val();
		var nom = $('#nom').val();
		var id_form = $('#id_form').val();	
		$.ajax({
			url: '../modules/ajax_login/add_album.php',
			type: 'POST',
			data: {id_user: id_user, nom: nom, id_form: id_form},
			success: function(data, textStatus, jqXHR) {
					if(data){
						alert(nom);
						alert(id_user);
						alert(id_form);
					}
					else{
						$(this).html("PAS OK !");
					}			
				},
			error: function(jqXHR, textStatus, errorThrown) {
				$('#form_add_videotheque').html('').html('<div class="error">Une erreur est survenue lors de la requête.</div>');}

		});
		return false;


Donc, alert() me donne bien la variable "nom", mais pour les autres la réponse est "undifined", j'en conclu qu'il n'existe pas, donc qu'il ne récupère pas la valeur de ses champs..

Ma question : Y a t'il une exception pour les input type hidden ?
En cherchant sur le net j'ai compris qu'il fallait utiliser serialize(), mais ca ne change rien à mon problème..

Je vous serez très reconnaissant de me mettre sur la bonne voie, cela fais plusieurs jours que je bloque sur ce problème..

Merci !
Je n'ai qu'une version local.

Je t'explique comment j'ai procédé :

J'ai un fichier index.php

        <div id="playlist">
        	<ul id="collection">Collection
                <li>- <a href="#">Blondes</a></li> 
            </ul>
            <ul id="add_collection">
            	<li><span></span><a href="#" id="add_videotheque">Créer une vidéothèque</a></li>
                <li><span></span><a href="#">Créer un album</a></li>
            </ul>
        </div>


Quand je clique sur le lien créer une vidéothèque ca ouvre une light box qui inclu en include un fichier formulaire.php (appelé en jquery) 

<!--FORMULAIRE POUR AJOUTER UNE VIDEOTHEQUE-->
<form id="form_add_videotheque" method="post" >
	<p>
    	<label>Nom de la vidéothèque :</label><input type="text" name="nom" id="nom" />
        <input type="hidden" value="1" name="id_form"/>
        <input type="hidden" value="<?php echo $donnees['id']; ?>" name="id_user"/>
    </p>
    <p>
    	<input type="submit" value="Enregistrer" id="submit"/>
    </p>
</form>


Après validation du formulaire la requête ajax est lancé, et après dans firebug on voit bien qu'il n'y que le nom de la videotheque qui qui est récupéré, et comme par hasard les donner en input hidden ne passe pas. 

	$('a#add_videotheque').click(function(){
		
		$('body').prepend("<div id='mask'><div id='form_addtheque'></div></div>");
		$('div#mask').fadeIn(500);
		var left = ($(window).width() - $('#form_addtheque').width()) / 2;
		var top = ($(window).height() - $('#form_addtheque').height()) / 2;
		$('#form_addtheque').css({'top' : top, 'left' : left});
  		$('#form_addtheque').load('../includes/formulaires.php #form_add_videotheque');
	});


	$("#submit").live("click", function(){
		var id_user = $('#id_user').val();
		var nom = $('#nom').val();
		var id_form = $('#id_form').val();	
		$.ajax({
			url: '../modules/ajax_login/add_album.php',
			type: 'POST',
			data: {id_user: id_user, nom: nom, id_form: id_form},
			success: function(data, textStatus, jqXHR) {
					if(data){
						alert(nom);
						alert(id_user);
						alert(id_form);
					}
					else{
						$(this).html("PAS OK !");
					}			
				},
			error: function(jqXHR, textStatus, errorThrown) {
				$('#form_add_videotheque').html('').html('<div class="error">Une erreur est survenue lors de la requête.</div>');}

		});
		return false;
	});



Si tu as besoin du site en ligne, je peux le mettre.

Merci beaucoup de ton aide, si tu trouve mon problème j'aurais presque envie de t'acheter une bouteille de champagne ^^

Bonne soirée.
Salut,
Et si tu fais :

<input type="hidden" value="1" name="id_form" id="id_form"/>
<input type="hidden" value="<?php echo $donnees['id']; ?>" name="id_user" id="id_user"/>


Tout simplement ?
WOUA °_° ! Ca fonctionne ! Je récupère les données !

Tu peux m'expliquer la raison please ?

Genre avec jquery cest pas name qui faut mettre, mais des ID ?

Merci beaucoup !
Ben…j'en sais rien Smiley lol Je n'utilise pas JQuery. Mais comme l'absence de "id" était la seule différence entre le champ texte et les champs hidden, j'ai pensé que "$('#nom').val();" se comporte comme document.getElementById…
(pour le champagne, un magnum de Moët et Chandon suffira Smiley lol )
Le sélecteur jQuery #... est en effet un sélecteur par id.
Pour faire simple, les sélecteur jQuery sont les mêmes qu'en CSS. Donc #quelqueChose pour sélectionner par id, ou .quelqueChose pour sélectionner par class, par exemple.
Mais bien sur ! Le bête que je suis, j'ai pas du tout fais attention à ce détail..Effectivement dans mon code JS je fais appel à ('#id_user').val() alors que dans mon formulaire je ne donne ni ID ni de CLASS à mes éléments en HIDDEN, je me suis contenté que de NAME.

Je trouve ca dommage d'avoir butté sur un truc aussi bête.. Je pensé apprendre quelque chose de nouveau face à ce problème, mais RIEN !

En tout cas je vous en suis très reconnaissant d'avoir pris la peine de m'aider.

Je souhaite à tous une très bonne année !
Sujet clos
Aller à