Deux formulaires sur la même page

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:

---

1 2 3 4

<form name="form1"> <input type="text" name="inpt1" id="inpt1"> </form>

---

Formulaire2:

Code:

---

1 2 3 4

<form name="form2"> <input type="text" name="inpt2" id="inpt2"> </form>

---

Code:

---

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:

---

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

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:

---

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); });

---

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:

---

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 ? :aie:

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

@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?

Dis,

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

:recherch: :google: : "jquery parents"

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

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

.parents()

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

(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 !

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:

---

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); });

---

Bonsoir,

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

Code:

---

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); }

---

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

Soit avec le code HTML suivant

Code:

---

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:

---

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; }

---