Discussion :

[Fredy007]

Bonjour,

J'ai 2 formulaires sur la même page, je veux savoir en événement focus sur un input, cet input appartient à quel formulaire:

Formulaire1:

Code :

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

1
2
3
4
 
<form name="form1">
<input type="text" name="inpt1" id="inpt1">
</form>

Formulaire2:

Code :

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

1
2
3
4
 
<form name="form2">
<input type="text" name="inpt2" id="inpt2">
</form>

Code :

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

1
2
3
4
5
 
$('input').click(function(){
  var get = $(this).parent('form').attr('name');
  alert(get);
  });

J'utilise la méthode parent pour cette exemple, si vous avez une autre solution en ajoutant une balise avant le input, ça retourn undefined:

Code :

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

1
2
3
4
5
6
7
8
 
<form name="form2">
<ul>
<li>
<input type="text" name="inpt2" id="inpt2">
</li>
  </ul>
</form>

Merci d'avance

[01001111]

quand parent reçoit un attribut, c'est pour filtrer les résultats déjà obtenus, pas pour cibler un parent plus en aval dans l'arborescence.
tu peux donc y arriver ainsi:

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
 
$('input').click(function(event){
  var get = event.target;
  while (get.parentNode.tagName.toLowerCase()!=="form" && get.parentNode!==document.documentElement) {
           // la seconde condition n'est pas indispensable, elle sert juste à éviter l'infinite loop si l'input n'est pas dans un formulaire
           get=get.parentNode;
  }
  get=get.name;
  alert(get);
});

[Invité]

Bonjour,

parent() cible le parent direct.
Pour peu que l'<input> soit dans un <p> (ou autres balises), parent() ne renverra pas la bonne valeur.

Il vaut mieux utiliser closest() :

Code javascript :

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

1
2
3
4
5
6
$(document).ready(function(){
	$('input').click(function(){
		var form_name = $(this).closest('form').attr('name');
		alert( form_name );
	});
});

@01001111
Pourquoi chercher à ré-inventer la roue ?

[danielhagnoul]

Il ne faut pas confondre les méthodes parent() et parents() : var get = $(this).parents('form').attr('name');

[Fredy007]

@01001111: J'ai essayé votre code et ça retourne undefined

@jreaux62: marche très bien

@danielhagnoul: C'est quoi la difference entre parents et parent?

Une autre question, alert($(this)) retourne [Object Object], comment puis je trouver le contenu de cet object?

[Invité]

Dis,

nos réponses ne te dispensent pas de recherches personnelle !

: "jquery parents"

Et je t'ai mis des liens pour "parent" et "closest". Les as-tu suivi ?

[Fredy007]

La seule confusion que j'ai, est ce parents peut nous rendre plusieurs éléments, ou bien elle retourne le résultat trouvé après elle s'arrête

[Invité]

.parents()

Qu'est-ce qui t'empêche de faire des tests ?

(et si tu ne comprends pas l'anglais; il existe des traducteurs en ligne)

Pour acquérir des connaissances, la meilleure (et seule) méthode a toujours été... d'apprendre !

[01001111]

Désolé d'avoir voulu réinventer la roue pour le coup!
j'avais mis un parentNode en trop et je ne connaissais ni l'existence de closest(), ni de parents()

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
 
$('input').click(function(event){
  var get = event.target;
  while (get.tagName.toLowerCase()!=="form" && get.parentNode!==document.documentElement) {
           // la seconde condition n'est pas indispensable, elle sert juste à éviter l'infinite loop si l'input n'est pas dans un formulaire
           get=get.parentNode;
  }
  get=get.name;
  alert(get);
});

[Auteur]

Bonsoir,

une méthode plus "classique" (sans bibliothèque de fonctions) :

Code javascript :

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
window.onload = function(){
	document.getElementById("inpt1").onclick = function(){getParent(this)};
	document.getElementById("inpt2").onclick = function(){getParent(this)};
};
 
function getParent(src)
{
	var srcId;
	var e;
	srcId = src.id;
	e = src.parentNode;
	while (e.tagName.toLowerCase()!="form")
		e = e.parentNode;
 
	alert(srcId + " a pour parent " + e.name);
}

[NoSmoking]

Bonjour,
quand les usines à gaz font des ravages
Ravages car il existe une propriété simple des éléments d'un formulaire, « form ».

Soit avec le code HTML suivant

Code html :

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

1
2
3
4
5
6
<form name="form_1">
  <input type="text" name="input_1">
</form>
<form name="form_2">
  <input type="text" name="input_2">
</form>

et par exemple le code javascript suivant

Code :

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

1
2
3
4
5
6
7
8
function fctFocus(){
    console.log( this.form.name);
}
var oElems = document.querySelectorAll('[name^=input_]');
var i, nb = oElems.length;
for( i=0; i < nb; i +=1){
    oElems[i].onfocus = fctFocus;
}