Erreur d'un select() dans un input

**darkterreur** · 14/03/2012, 15h18

Bonjour,

je mettre au chargement de la page le curseur de la souris dans le seul champ input de ma page.
J'ai bien utiliser le code utiliser généralement, cependant dans ma page je charge un pdf et lors du chargement il prend le focus du champs. c'est frustrant je voudrai qu'une fois charger le focus soit dans mon input qu'il n'y ai plus qu'a taper.

je vous met le code ici :

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
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
 
<body onload="document.getElementById('NumBl').select()">
		<div class="head">
			<table class="header">
				<tr>
					<td  class="header" width='50%'><img src='./images/logo_otec.jpg' alt="logo otec" /></td>
					<td  class="header" width='50%'><img src='./images/otec3.jpg' alt="picture" id="pic" /></td>
				</tr>
				<tr>
					<td  class="header" colspan='2'>SAISIE DES BONS DE LIVRAISON SCANNES</td>
				</tr>
			</table>
		</div>		
 
		<div class="englobe">
			<div class="menu">
				<h3> Entrer le num&eacute;ro du BL</h3>
 
				<p>
					<form method="post" <?php echo"action='traitement.php?var=".$NameFile."'";?> onsubmit="return ControleChamp()">
					<label>Num&eacute;ro BL</label> : <input id='NumBl' type="text" name="NumBl" onKeydown="MasqueSaisie();"/><br/><br/>
 
 
					<input type="submit" value="Valider" /><br/>
					</form>
				</p><br/><br/>
 
				<input type="button" value="Exit" onclick="window.close();" /><br/><br/><br/><br/>
				<img src='./images/logo_snew.jpg' alt="logo snew" /><br/>
 
				<p>
					T&eacute;l: 01 41 74 95 34
				</p><br/><br/><br/>
 
				<img class="camion" src='./images/transport.jpg' alt="notre r&eacute;seau" /> <br/>
 
			</div>
 
			<div class="body">
				<?php
                                        echo "<iframe src='$Target' width='827' height='900' align='middle'></iframe>";
                                ?>
			</div>
		</div>
 
	</body>

Voila je pense que nous pouvons ruser mais je n'ai pas suffisamment de logique JS.

Merci d'avance

**SpaceFrog** · 14/03/2012, 15h23

focus ...

Code :

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

document.getElementById('NumBl').focus()

ou si il contient déja une valuer et que tu souhaites te mettre à la fin :

Code :

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

document.getElementById('NumBl').value=document.getElementById('NumBl').value

**darkterreur** · 14/03/2012, 18h20

Bonsoir,

alors j'ai tester avec ceci

Code :

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

1
2
 
<body onload="document.getElementById('NumBl').focus()">

Cela me fait la meme chose qu'avec le select()
je voit le curseur dans le input puis le pdf fini de ce charger et hop je perd le curseur de mon champs.

Je précise que le champs dois etre remplit a la mains j'espere que cela repond a ceci

ou si il contient déja une valuer et que tu souhaites te mettre à la fin :

Code :Sélectionner tout - Visualiser dans une fenêtre à part
document.getElementById('NumBl').value=document.getElementById('NumBl').value

je vous remercie par avance.

**SpaceFrog** · 15/03/2012, 08h48

Désolé je n'ai pas compris (et ne comprends toujours pas l'ergonomie recherchée ...

**darkterreur** · 15/03/2012, 09h32

Désolé je ne suis peut être pas suffisamment clair. Je vais essayer d'y remédier.

donc il s'agit d'une application permettant de parcourir un a un un ensemble de PDF. Vous pouvez voir dans le code, il y a un lecteur qui affiche le PDF, nous en avons besoin pour lire le contenu et saisie dans le input ce qui a été lu.

Ensuite en découle un traitement puis, nous rechargeons la page avec un nouveau PDF et ainsi de suite.

Seulement, il s'agit de plusieurs centaine de PDF par jours, donc la personne qui saisit doit a chaque replacer le curseur dans le input pour saisie ce qu'elle doit. J'ai donc essayé les bout de code que vous avez vu ci-dessus. Seulement quand je fait mes test, je voit le curseur apparaître dans le input puis disparaître lorsque le PDF a fini de charger.

En gros le chargement du PDF vole le focus, et viens donc après le code placé dans le onload du body.

Donc y a t'il possibilité de déclencher l’évènement une fois le PDF chargé?

J’espère avoir été suffisamment clair.

**Bovino** · 15/03/2012, 09h47

J’espère avoir été suffisamment clair.

Pour être franc, je ne suis pas sûr que tous tes mots soient dans le bon ordre !

Bref, tu peux essayer de rajouter un id à ton iframe ("pdfFrame" dans mon exemple) et d'ajouter :

Code :

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

1
2
3
document.getElementById('pdfFrame').onload = function(){
    document.getElementById('NumBl').focus();
}

**darkterreur** · 15/03/2012, 11h50

Bonjour,

je suis désolé mais cela ne fonctionne pas
je met les bout de code modifié des fois que je me soit trompé

Code :

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

1
2
 
<body onload="document.getElementById('pdfFrame').onload = function(){    document.getElementById('NumBl').focus();}">

Code :

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

1
2
3
4
 
<?php
      echo "<iframe id='pdfFrame' src='$Target' width='827' height='900' align='middle'></iframe>";
?>

voila

**Bovino** · 15/03/2012, 12h01

As-tu fait attention à l'imbrication des quotes ? C'est facilement vérifiable en regardant le code source généré dans le navigateur.

Sinon :

Code html :

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

<iframe id='pdfFrame' src='$Target' width='827' height='900' align='middle' onload='document.getElementById(\'NumBl\').focus();'></iframe>

?

Et si ça ne marche pas, essaye

Code html :

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

<iframe id='pdfFrame' src='$Target' width='827' height='900' align='middle' onload='alert(\'foo\');'></iframe>

pour voir ce qu'il y a dans l'iframe au moment de l'alert...

**darkterreur** · 15/03/2012, 16h22

Alors je n'ai pas vu d'erreur particulière avec les quotes.

j'ai tester ces deux code la :

Code :

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

1
2
 
<iframe id='pdfFrame' src='$Target' width='827' height='900' align='middle' onload=\"document.getElementById('NumBl').focus();\"></iframe>

Code :

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

1
2
 
<iframe id='pdfFrame' src='$Target' width='827' height='900' align='middle' onload=\"alert('foo');\"></iframe>

J'avais des erreurs avec ta syntaxe.
Bref j'ai toujours rien même pas de alert() étrange.

**Bovino** · 15/03/2012, 16h30

Tu peux montrer le code HTML généré ? (CTRL + U dans Firefox)

**darkterreur** · 15/03/2012, 16h47

voila, je précise que c'est pour IE au cas ou ...

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
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
 
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf -8" />
		<link rel="stylesheet" href="otec2.css" />
		<title>OTEC's Project</title>
		<script language="JavaScript1.2" src="masks.js"></script>
	</head>
 
<script language="javascript"> 
 
	function $(monID){
		return document.getElementById(monID);
	}
 
	function FocusChargement(){
		$('NumBl').focus();
	}
 
	function MasqueSaisie(){
		oEuroMask = new Mask("## # ## #* ### ##", "string");
		oEuroMask.attach($('NumBl'));
	}
 
	function ControleChamp(){
		var elem = $('NumBl');
		var regex = /[0-9]{2}\s\d\s[0-9]{2}\s\d\w\s[0-9]{3}\s[0-9]{2}/;
		if(regex.test(elem.value))
		{
			return true;
		}
		else
		{
			elem.style.borderColor="red";
			return false;
		}
	}
 
</script>
	<body >
		<div class="head">
			<table class="header">
				<tr>
					<td  class="header" width='50%'><img src='./images/logo_otec.jpg' alt="logo otec" /></td>
					<td  class="header" width='50%'><img src='./images/otec3.jpg' alt="picture" id="pic" /></td>
				</tr>
				<tr>
					<td  class="header" colspan='2'>SAISIE DES BONS DE LIVRAISON SCANNES</td>
				</tr>
			</table>
		</div>
 
 
	<!--	<div class="head">
			<p class="logo">
				<img src='./images/logo_otec.jpg' alt="logo otec" />
			</p>
			<p class="head_pic"> 
				<img src='./images/otec3.jpg' alt="picture" id="pic" />
			</p>
			<p class="head_text">
				SAISIE DES BONS DE LIVRAISON SCANNES
			</p>
		</div> -->
 
 
		<div class="englobe">
			<div class="menu">
				<h3> Entrer le num&eacute;ro du BL</h3>
 
				<p>
					<form method="post" action='traitement.php?var=Copie de bl - 10.pdf' onsubmit="return ControleChamp()">
					<label>Num&eacute;ro BL</label> : <input id='NumBl' type="text" name="NumBl" onKeydown="MasqueSaisie();"/><br/><br/>
 
 
					<input type="submit" value="Valider" /><br/>
					</form>
				</p><br/><br/>
 
				<input type="button" value="Exit" onclick="window.close();" /><br/><br/><br/><br/>
				<img src='./images/logo_snew.jpg' alt="logo snew" /><br/>
 
				<p>
					T&eacute;l: 01 41 74 95 34
				</p><br/><br/><br/>
 
				<img class="camion" src='./images/transport.jpg' alt="notre r&eacute;seau" /> <br/>
 
			</div>
 
			<div class="body">
				<iframe id='pdfFrame' src='./Temp/Copie de bl - 10.pdf' width='827' height='900' align='middle' onload="alert('foo');"></iframe>			</div>
		</div>
 
	</body>
</html>

**SpaceFrog** · 15/03/2012, 16h49

Code :

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

<script language="JavaScript1.2"

Tu fais de la paléontologie ???

**darkterreur** · 15/03/2012, 17h00

ha?

heu non pourquoi ?

je suppose que c'est une vieille version?

**Bovino** · 15/03/2012, 17h04

Comprendre la balise script

D'autre part, ton autre balise <script> doit se trouver soit dans le <head> soit dans le <body> mais certainement pas entre les deux.

Mettre des espaces dans le nom de fichier appelé, c'est un peu se compliquer la vie...

A part ça, je viens de faire un test rapide et le

Code :

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

<body onload="document.getElementById('NumBl').focus()">

fonctionne parfaitement...

**darkterreur** · 15/03/2012, 17h27

d'accord tu peux me donner un exemple que je voit ?
ou doivent etre mes balisent <script> et de quelle fichier parle tu?

et quelle version dois je utiliser pour le JS?

ha je n'avais pas vu le liens je regarde de suite désolé

merci d'avance

**Bovino** · 15/03/2012, 17h39

http://dmouronval.developpez.com/iframe.html

**darkterreur** · 15/03/2012, 18h05

merci pour ce nouveau lien mais petite question, y a t'il un rapport entre ma balise iframe et l'ajax ? je suppose que tu ne ma pas donné ce liens par hasard mais j'ai du mal a comprend.
Je vais le lire pour demain.

Donc si je comprend bien je dois changer "langage" part "type" mais dois je annoncé la version? c'est pas précisé dans le doc.

De plus mes balises <script> doivent t'elle être a la fin de mon </body> ?

Apres j'ai vu les espaces dans le src du ifame il s'agit d'une version test et il s'agit d'un pdf dupliqué plusieurs fois c'est supercopieur qui lui a donné son nom, mais en production il n'y a pas d'espace dans le nom. C'étais bien de ces espaces la dont tu me parlais?

**Bovino** · 15/03/2012, 18h32

y a t'il un rapport entre ma balise iframe et l'ajax ?

Non, c'était juste pour mettre un pdf dans l'iframe !

Donc si je comprend bien je dois changer "langage" part "type" mais dois je annoncé la version? c'est pas précisé dans le doc.

L'attribut type correspond à un type mime, pas à une version (dont on se fout éperduement : la version idéale est la dernière mise à disposition par le navigateur).

De plus mes balises <script> doivent t'elle être a la fin de mon </body> ?

Ben là, ça dépend des scripts...

**darkterreur** · 16/03/2012, 15h31

Bonjour,

Je dois avouer que j'ai eu du mal avec le lien concernant le iframe et le pdf ajax.

Finalement j'ai compris et effectivement ton exemple fonctionne. Mais chez moi c'est un peu plus compliqué.

Bon j'ai fait quelque modification et je les poste ici.

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
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
 
<?php
        include('./config.php');
        
        $NameFile = htmlentities($_GET['var']);
        if(!empty($NameFile))
        {       
                $Target = $repTemp.$NameFile;
        }
        else
        {
                $Target = "./Page_de_garde.pdf";
        }
        
?>
 
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf -8" />
		<link rel="stylesheet" href="otec2.css" />
		<title>OTEC's Project</title>
		<script type="text/javascript" src="masks.js"></script>
 
		<script type="text/javascript">
 
			function $(monID){
				return document.getElementById(monID);
			}
 
			function MasqueSaisie(){
				oEuroMask = new Mask("## # ## #* ### ##", "string");
				oEuroMask.attach($('NumBl'));
			}
 
			function ControleChamp(){
				var elem = $('NumBl');
				var regex = /[0-9]{2}\s\d\s[0-9]{2}\s\d\w\s[0-9]{3}\s[0-9]{2}/;
				if(regex.test(elem.value))
				{
					return true;
				}
				else
				{
					elem.style.borderColor="red";
					return false;
				}
			}
 
		</script>
	</head>
 
 
	<body onload="document.getElementById('NumBl').focus();">
		<div class="head">
			<table class="header">
				<tr>
					<td  class="header" width='50%'><img src='./images/logo_otec.jpg' alt="logo otec" /></td>
					<td  class="header" width='50%'><img src='./images/otec3.jpg' alt="picture" id="pic" /></td>
				</tr>
				<tr>
					<td  class="header" colspan='2'>SAISIE DES BONS DE LIVRAISON SCANNES</td>
				</tr>
			</table>
		</div>
 
 
	<!--	<div class="head">
			<p class="logo">
				<img src='./images/logo_otec.jpg' alt="logo otec" />
			</p>
			<p class="head_pic"> 
				<img src='./images/otec3.jpg' alt="picture" id="pic" />
			</p>
			<p class="head_text">
				SAISIE DES BONS DE LIVRAISON SCANNES
			</p>
		</div> -->
 
 
		<div class="englobe">
			<div class="menu">
				<h3> Entrer le num&eacute;ro du BL</h3>
 
				<p>
					<form method="post" <?php echo"action='traitement.php?var=".$NameFile."'";?> onsubmit="return ControleChamp()">
					<label>Num&eacute;ro BL</label> : <input id='NumBl' type="text" name="NumBl" onKeydown="MasqueSaisie();"/><br/><br/>
 
 
					<input type="submit" value="Valider" /><br/>
					</form>
				</p><br/><br/>
 
				<input type="button" value="Exit" onclick="window.close();" /><br/><br/><br/><br/>
				<img src='./images/logo_snew.jpg' alt="logo snew" /><br/>
 
				<p>
					T&eacute;l: 01 41 74 95 34
				</p><br/><br/><br/>
 
				<img class="camion" src='./images/transport.jpg' alt="notre r&eacute;seau" /> <br/>
 
			</div>
 
			<div class="body">
				<?php
                                        echo "<iframe src='$Target' width='827' height='900' align='middle'></iframe>";
                                ?>
			</div>
		</div>
 
	</body>
</html>

J'ai esayé de placer mon code en fin de body il refuse.
Le probleme est que au premier chargement cela fonctionne puis au second cela ne fonctionne plus mais je n'ai pas d'erreur.

A savoir que je passe par une premiere page php qui prend le premier pdf d'une longue ligné, et me le déplace dans un dossier temporaire puis envoi a la page dont le code est affiché avec le nom du pdf en variable get.

Une fois la saisie effectué, je suis dirigé vers une page de traitement qui renome, déplace fait des copies, et rappel la premiere page pour reprendre un autre pdf.

Techniquement rien ne change et pourtant au second chargement je n'ai pas mon focus. Frustrant. une idée?

Bon si cela peut aider j'ai une autre fonction que j'appelle normalement avec le onload du body.

Code :

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

1
2
 
	<body onload="MasqueSaisie();document.getElementById('NumBl').focus();">

cela me permet d'appliquer un masque de saisie sur le champs input mais vous l'avez comprit. Quand je test maintenant que j'ai un semblant des fonctionnement, cela se passe bien au premier chargement super!!!
Mais au second c'est la catastrophe j'ai ceci comme erreur JS dans IE

Code :

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

1
2
3
4
5
'document.frmExample.erreur' a la valeur Null ou n'est pas un objet.
 
masks.js
ligne : 92
caractere : 2

A savoir que si j'applique uniquement le masque de saisie j'ai pas de problème, je suppose donc que cela a un rapport.

Pourquoi faire simple? une idée ?

**darkterreur** · 19/03/2012, 15h03

Bonjour,

Vous n'avez plus d'idées ?

Erreur d'un select() dans un input

JavaScript

Discussions similaires

Partager

Partager