Passer du javascript au Jquery

Version imprimable

Bonjour,

J'ai un code javascript qui me permet de remplir une liste déroulante via une popup. Pour cela j'utilise du Javascript mais j'aimerais passer en Jquery.

Voici le code de la page principale:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
    function doc(id_op)  {
	     if (document.layers)  { // NS 4 et <
		   return document[id_op];
		 }
		 if (document.all)  { // IE
		   return document.all[id_op];
		 }
		 if (document.getElementById)  {
		   return document.getElementById(id_op);
		 }
 
		}
 
		function ajout(id_op, value, text)  {
		    formulaire = doc(id_op);
		   // Recuperation des informations
		    nb = formulaire.length;
		   // On compte le nombre d'<option />
		    nouvel_element = new Option(text, value, false, true);
 
		    formulaire.options[nb] = nouvel_element;
		}

et voici le code de la page popup

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
function doc(id_op)
    {
	     if (document.layers)
	     { // NS 4 et <
		   return document[id_op];
		 }
		 if (document.all)
		 { // IE
		   return document.all[id_op];
		 }
		 if (document.getElementById)
		 {
		   return document.getElementById(id_op);
		 }
 
		}
 
 
    function valid()
    {
        value = doc('value').value;
        text = doc('id_n').value;
        opener.ajout('id_op', value, text);
    }
 
        <form id="formcache" class="form-signin" action="" method="post" onsubmit="valid();">
            <fieldset>
            <h2 class="form-signin-heading">Confirmation</h2>
                <div>
                    <center>L'opération <strong>"{{ name }}"</strong> à bien été ajouté."!!</center>
 
                    <input type="hidden" name="value" id="value" value=""  />
                    <input type="hidden" class="form-control" id="id_n" maxlength="30" name="name" value=""/></p>
                    <br>
                </div>
                <button class="btn btn-lg btn-primary btn-block" type="submit" id="id_op" onclick="window.close();">Fermer la fenêtre</button>
            </fieldset>
        </form>

Je code en Django d'ou l'apparition de certaine balise mais cela ne change rien pour le code.

Du coup, j'ai -essayé- de transformer ce code:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
function doc(id_operation)
    {
	     if (document.layers)
	     { // NS 4 et <
		   return document[id_operation];
		 }
		 if (document.all)
		 { // IE
		   return document.all[id_operation];
		 }
		 if (document.getElementById)
		 {
		   return document.getElementById(id_operation);
		 }
 
		}
 
 
    function valid()
    {
        value = doc('value').value; //$('#value').text();
        text = doc('id_name').value;
        opener.ajouter('id_operation', value, text);
    }

en ce code

Code:

1
2
3
4
	$("form").submit(function(event) {
		$('#value').text();
		$('#id_n').text();
    });

Je ne suis pas trop sur de moi, et pour le code la page principale, je donne ma langue au chat !!

Merci

Bonjour,

Citation:

Pour cela j'utilise du Javascript mais j'aimerais passer en Jquery.

c'est quand même une idée bizarre !!! jQuery n'est jamais que du javascript.

Ta fonction :
Code:

1 2 3 4 5 6 7 8 9 10 11 function doc(id_op) { if (document.layers) { // NS 4 et < return document[id_op]; } if (document.all) { // IE return document.all[id_op]; } if (document.getElementById) { return document.getElementById(id_op); } }
est quand même un collector en 2015 :mrgreen: mais tu es sur la bonne voie avec ton value = doc('value').value; //$('#value').text();.

Prend quand même le temps de lire la FAQ jQuery et bien évidemment la documentation officielle qui regorge d'exemples.

Un exemple basique de transaction AJAX en jQuery :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
<form id="formcache">
    <fieldset>
        <h2>Confirmation</h2>
        <div>
            <p>L'opération à bien été ajoutée !</p>
            <p>
                <input id="value" name="value" value="57">
                <input id="id_n" name="name" value="Pierre Dupond">
            </p>
        </div>
        <input type="submit" value="Fermer la fenêtre">
    </fieldset>
</form>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
$( function(){ // forme abrégée de $(document).ready(function(
 
    $( "#formcache" ).submit( function(){
 
        // debug, console, touche F12
        console.log( $( this ).serialize() );
 
        // value=57&name=Pierre+Dupond
 
        var jqXHR = $.post( "monfichier.php", $( this ).serialize() );
 
        jqXHR.done( function( data, textStatus, jqXHR ){
            // succès de la transaction, on doit traiter le contenu de data
            console.log( data, textStatus, jqXHR );
 
        });
 
        jqXHR.fail( function( jqXHR, textStatus, errorThrown ){
            // échec de la transaction, gérer la catastrophe
            console.log( jqXHR, textStatus, errorThrown );
 
        });
 
        jqXHR.always( function( jqXHR, textStatus ){
            // la transaction est terminée
            // nettoyage
            // exécution d'un code dépendant
            console.log( jqXHR, textStatus );
 
        });
 
        return false;
    });
});

Ma FAQ jQuery

Bonjour à tous, j'ai un peu progressé:

Voici le code pour la page principale:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 function doc(id_op){ if $(''){ return id_op=$('#id_op'); } }; function ajouter(id_op, value, text) { formulaire = doc(id_op); // Recuperation des informations nb = formulaire.length; // On compte le nombre d'<option /> nouvel_element = new Option(text, value, false, true); formulaire.options[nb] = nouvel_element; }
Pour ce code si je n'ai aucune idée pour la transposition

et le code de la fenetre popup
Code:

1 2 3 4 5 6 7 8 9 10 function doc(id_operation){ if $(''){ return id_op=$('#id_op'); } }); function valid() { var value = $('#value').text(); var id_n = $('#id_n').text(); window.opener.$('id_op', value, id_n); };
Je n'ai pas trouver l'équivalent de opener en jQuery pour faire passer un argument d'un fenetre enfant à une fenetre parents

04/02/2015, 20h48
cobra85

Pour function doc(id_operation) comprendre function doc(id_op)
04/02/2015, 22h19
danielhagnoul

Citation:

Envoyé par cobra85

Je n'ai pas trouver l'équivalent de opener en jQuery pour faire passer un argument d'un fenetre enfant à une fenetre parents

jQuery c'est du JS ! Ce n'est pas parce que jQuery est disponible que vous pouvez négliger le JS.

D'autant que ES5 et le futur ES2015 (ex ES6) offrent des nouveautés particulièrement intéressantes.

Pour "opener", c'est simplement une propriété de l'objet "window".
05/02/2015, 09h15
Bovino

Code:

if $(''){...}

8O C'est quoi cette syntaxe ? 8O

Salut,

J'ai du vouloir transformer ceci:

Code:

1
2
3
4
function doc(id_op) {
  if (document.getElementById) {<------|
    return document.getElementById(id_op);
  }

05/02/2015, 21h29
NoSmoking

Dans ce cas autant te familiariser tout de suite avec la notation jQuery et d’utiliser les nombreuse méthodes mise à ta disposition par la librairie.

Au risque de me répéter compulse la documentation, je t'aurais bien proposé un livre mais je crois savoir qu'on ne le trouve plus :mrgreen:
06/02/2015, 08h03
Bovino

Citation:

Envoyé par NoSmoking

je crois savoir qu'on ne le trouve plus

Tu crois mal ! :mrgreen:
Mais ça me rappelle que je n'ai pas pris le temps de finir la mise en forme (notamment la coloration syntaxique).
07/02/2015, 10h00
NoSmoking

Citation:

Tu crois mal ! :mrgreen:

:koi: il ne me semble pas avoir vu d'annonce...et le lien dans ta signature serait donc à mettre à jour :whistle:
09/02/2015, 08h02
Bovino

Non, parce que comme dit, la mise en forme n'est pas encore finalisée... :(
Mais ma signature a été modifiée. :ccool:
09/02/2015, 11h18
Franck.H

Citation:

Envoyé par NoSmoking

Dans ce cas autant te familiariser tout de suite avec la notation jQuery et d’utiliser les nombreuse méthodes mise à ta disposition par la librairie.

Au risque de me répéter compulse la documentation, je t'aurais bien proposé un livre mais je crois savoir qu'on ne le trouve plus :mrgreen:

Ce livre est très bien aussi
11/02/2015, 18h33
NoSmoking

Je veux bien te croire mais celui ci, je le connais, l'ais lu et il est très bien, facilement abordable et permet même de démystifier jQuery pour les plus réfractaires.