input dans un div

**totoche** · 12/11/2009, 15h28

Bonjour,
j'essaye de créer un DIV avec un input, le DIV et l'input sont associés par une feuille de style, la creation se fait par javascript.
Mais l'action sur le bouton ne produit rien

css

Code :

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
17
18
19
20
21
22
23
 
div#identification {
	width:300px;
	height:300px;
	background-color:#FFCC00;
	}
 
 
div#identification.input.nomTextBox{	
		font-size:10px;
		margin:0px;
		padding:0px;
		height:12px;
	}
 
div#identification.input.prenomTextBox{	
		position:relative;
		top:20px
		font-size:10px;
		margin:0px;
		padding:0px;
		height:12px;
	}

html + js

Code :

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
17
18
19
20
21
 
<html>
<head>
<script language="javascript">
function createMasque()
		{
			var myDiv = document.createElement('DIV');
			myDiv.className = 'identification';
 
			var textBox = document.createElement('INPUT');
			textBox.className = 'nomTextBox';
			textBox.id = 'textBoxNom' 
			textBox.value = "test";
		}
</script>
<link rel="stylesheet" href="f.css" type="text/css"></link>
</head>
<body>
<input type='button' onclick='createMasque();'>
</body>
</html>

Merci de votre aide

**vermine** · 12/11/2009, 15h32

Bonjour,

Créer les éléments, c'est bien. Maintenant, il faut les attacher à leur parent.

Code :

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

1
2
 
myDiv.appendChild(textBox);

**totoche** · 12/11/2009, 15h41

merci,
j'ai tjs rien qui s'affiche

**vermine** · 12/11/2009, 15h43

Hé bien oui, j'ai dis qu'il faut "les" rattacher à "leur" parent. J'ai trouvé le parent de "textBox" mais qui est le parent de "myDiv" ?

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<body>
<form id="monForm">
<input type='button' onclick='createMasque();'>
</form>
</body>
 
<script>
//La fonction blabla bla
   ...
   myDiv.appendChild(textBox);
   monForm.appendChild(myDiv);
   ...
</script>

**totoche** · 12/11/2009, 15h52

merci, ça fonctionne en partie l'input s'affiche

Code :

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

1
2
3
4
5
6
7
8
9
10
 
...
document.getElementById('tst').appendChild(myDiv);
..
		}
</script>
<link rel="stylesheet" href="f.css" type="text/css"></link>
</head>
<body id="tst">
...

, mais les propriétés de la feuillle de style ne sont pas prises en compte...

**vermine** · 12/11/2009, 15h56

Ouf là niveau CSS je ne m'y connais pas trop.
A la place de .className, c'est peut-être .class ?

Code :

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

1
2
3
 
myDiv.class = 'identification';
textBox.class = 'nomTextBox';

input dans un div

JavaScript

Vue hybride

Discussions similaires

Partager

Partager