passer une variable js d'un div à un autre [Résolu]

[laurentSc]

J'ai tenté de faire ce qui est marqué ds le titre ainsi :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script language="javascript">
function Action1(sel_id)
{
item=sel_id.value;
}
document.write('<table><tr><td><div>');
document.write('<select id="selectId" onchange="Action1(this)">');
document.write('<option value="champ1">Champ1</option>');
document.write('<option value="champ2">Champ2</option>');
document.write('</select></div></td><td>');
document.write('<div>');
document.write(item);
document.write('<div></td></tr></table>');
</script>

mais ça ne marche pas : cela pourrait-il marcher ? (j'ai volontairement mis tout le html dans des document.write pour faire plaisir à Nadox (je ne sais pas pourquoi, il adore les document.write ) et pour ne pas interrompre le script js pour avoir plus de chance que la variable js soit connue dans le 2e div)

[NoSmoking]

Bonsoir, il faudrait sûrement que tu reprennes le B.A.BA du javascript, pas pour le document.write, mais pour l'affectation des valeurs dans une DIV

Code :

1
2
3
4
5
6
7
8
9
10
11
function Action1( sel_id){
  document.getElementById('div_result').innerHTML = sel_id.value;
}
document.write('<table><tr><td><div>');
document.write('<select id="selectId" onchange="Action1(this)">');
document.write('<option value="champ1">Champ1</option>');
document.write('<option value="champ2">Champ2</option>');
document.write('</select></div></td><td>');
document.write('<div id="div_result">');
// document.write(item);
document.write('</div></td></tr></table>');

[Eric2a]

Tu déclares une fonction qui ne fait rien d'autre qu'affecter la valeur d'un champs à une variable locale à la fonction.

Le code Javascript crée une table, un formulaire et... génère probablement une erreur car la variable globale item utilisé pour la méthode document.write(); n'existe pas.

[laurentSc]

No smoking, ton code marche, mais ceci n'est qu'un test préliminaire avant d'aller plus loin, et c'est la variable que je voudrais transmettre (et non pas juste en afficher la valeur), pour pouvoir lui appliquer un traitement. J'ai donc tenu compte de la remarque de Eric2A et fait :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<script language="javascript">
var item;
function Action1(sel_id)
{
item=sel_id.value;
}
document.write('<table><tr><td><div>');
document.write('<select id="selectId" onchange="Action1(this)">');
document.write('<option value="champ1">Champ1</option>');
document.write('<option value="champ2">Champ2</option>');
document.write('</select></div></td><td>');
document.write('<div>');
document.write(item);
document.write('<div></td></tr></table>');
</script>

mais le document.write(item); génère un undefined...donc, comment faire marcher ça ?

[nadox]

Merci d'avoir pensé à moi laurentSc...
Mais si je parle souvent des document.write, c'est que justement, ton code cherche à positionner la valeur de la variable(elle est bien globale puisque pas de 'var') sur l'évènement onchange d'un select et que le document.write est depuis longtemps écrit à ce moment(et le variable n'avais pas la valeur attendu à ce moment)... donc non ça ne peux pas fonctionner comme ça !

Le code de NoSmoking fait ce que tu cherche à faire.

Quel traitement tu veux lui faire à cette variable ? Dans la div tu ne pourra rien faire d'autre que l'afficher. Dans la fonction, tu pourra faire un traitement dessus.

On reprends : les document.write sont écrit au chargement de la page.
A ce moment la variable est vide, 'undefined'.
La fonction sur le onchange est donc exécuté après(la page est chargé pour qu'on puisse toucher au select). Et là, la variable ne sert plus à rien pour le document.write qui est déjà écrit.

[NoSmoking]

j'ai un peu de mal à comprendre la démarche.

Le javascript est interprété comme il se présente, de haut en bas et de gauche à droite, c'est séquentiel.

Si la valeur est initialisée alors elle pourra être exploitée dans la suite du code, dans le cas contraire elle vaudra undefined.

Si au chargement de la page tu veux affecter à la DIv la valeur du SELECT il te faut dans ce cas le faire une fois le document loadé.

exemple

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
window.onload = function(){
  var oSelect = document.getElementById('selectId');
  var oDiv = document.getElementById('div_result');
  oDiv.innerHTML = oSelect.value;
}
function Action1( sel_id){
  document.getElementById('div_result').innerHTML = sel_id.value;
}
document.write('<table><tr><td><div>');
document.write('<select id="selectId" onchange="Action1(this)">');
document.write('<option value="champ1">Champ1</option>');
document.write('<option value="champ2">Champ2</option>');
document.write('</select></div></td><td>');
document.write('<div id="div_result">');
document.write('</div></td></tr></table>');

ou encore en utilisant la fonction Action1

Code :

1
2
3
4
window.onload = function(){
  var oSelect = document.getElementById('selectId');
  Action1( oSelect);
}

[laurentSc]

Quel traitement tu veux lui faire à cette variable ?

Le but est de faire moi-même le code que tu avais brillamment fait Nadox. Si je souhaite le faire moi-même (donc, d'une façon moins chiadée), c'est pour être capable de le maintenir. Donc l'idée reste la même : l'utilisateur fait un choix avec un select (un choix de fichier video), et celui-ci est ensuite affiché (par appel du player). Je sais déjà appeler le player, mais je voudrais moi-même (avec mon code) passer le choix de l'utilisateur au player.
Mais une solution ne serait-elle pas, dans l'appel de la fonction sur le onChange du select, d'appeler le player en fonction du choix de l'utilisateur ?

[NoSmoking]

Envoyé par laurentSc

Mais une solution ne serait-elle pas, dans l'appel de la fonction sur le onChange du select, d'appeler le player en fonction du choix de l'utilisateur ?

cela me parait le plus évident d'une part et le plus simple d'autre part

Code :

1
2
3
4
function Action1( sel_id){
  var ref = sel_id.value;  // recup. valeur
  fctAppel( ref);          // appel de la super fonction
}

[nadox]

Je confirme, c'est ce qu'il y a de mieux à faire.
C'est d'ailleurs ce que mon code fait. La seule véritable distinction avec ce que tu est en train de faire, c'est que j'avais construit le html en DOM à la place des 'document.write' (et c'est d'ailleurs bien la seule chose qu'on peut faire avec des document.write : écrire).

Par contre, tu n'aurais toujours pas l'envie de lire quelques tutos ou FAQ, afin de connaître le langage que tu (cherches à) utilise(r) ?
Parce que c'est gentil de penser à nous demander quand tu rencontre un problème, mais si tu ne cherche pas à lire un peu plus de documentation, il va pas aller bien vite ton apprentissage...

[laurentSc]

Par contre, tu n'aurais toujours pas l'envie de lire quelques tutos ou FAQ

Avoir envie, c'est une chose, mais avoir le temps en est une autre. Et il n'y a pas qu'en js que je souhaite m'améliorer, il y aussi le PHP et le flash (et notamment, à Noël, je me suis fait offrir un bouquin sur le framework Zend (un équivalent PHP de jQuery), et je ne l'ai pas encore commencé...)(et il faut savoir qu'il y a 5 ans, je ne savais même pas que le HTML existait...)

[nadox]

Ça prendrais un peu de temps pour démarrer sur des bases complètes, mais au lieu d'en passer à essayer du code dont tu ne comprends pas le sens, ça t'en ferais probablement gagner... Tu pense pas ?
Tu pourrais ensuite plus facilement utiliser un code existant et le maintenir.

[Eric2a]

C'est clair...

Faut se dire que prendre le temps d'étudier c'est un peu la deuxième règle de succès de SpaceFrog (voir sa signature)



Non je déconne, la deuxième règle c'est... ne pas utiliser document.write()

[laurentSc]

Non je déconne, la deuxième règle c'est... ne pas utiliser document.write

Si Nadox en avait, il y aurait celle-là aussi...
Cela dit, j'ai acquis assez facilement les bases du js et du PHP pour avoir fait une dizaine d'années du langage C (professionnellement)(et webmaster, c'est professionnel aussi (depuis 2006, et à l'occasion apprentissage du html) et aussi bénévole (une passion))

[laurentSc]

La suite de ce fil est là, et c'est pas loin de marcher car ça marche déjà avec un code pourri (plein de document.write).