Exemple de document

Ce document affiche la structure JavaScript de ce document qui contient un formulaire. C'est la partie correspondant aux instructions suivantes :


function dump_props(obj, obj_name) {
    var result= "", i= "";
    for( i in obj)
        result += obj_name + "." + i + " = " 
                  + obj[i] + "<br>\n";
    return result;
}

document.write("<h2> Structure de <tt> document </tt><hr></h2>");
document.write(dump_props(document,"document"));
document.write("<h2> Structure de <tt> location </tt><hr></h2>");
document.write(dump_props(location,"location"));
document.write("<h2> Structure de <tt> history </tt><hr></h2>");
document.write(dump_props(history,"history"));
document.write("<h2> Structure du formulaire<hr></h2>");
document.write(dump_props(document.myform,"document.myform"));

document.write("<h3> Description du champ de saisie<hr></h3>");
document.write(dump_props(document.myform.text1,"document.myform.text1"));

document.write("<h3> Description de la case a cocher<hr></h3>");
document.write(dump_props(document.myform.Check1,"document.myform.Check1"));

document.write("<h3> Description du bouton<hr></h3>");
document.write(dump_props(document.myform.Button1,"document.myform.Button1"));

Ce qui est important ici est le texte affiché à la suite du formulaire. Le code source de cette page n'est donnée qu'à titre d'exemple de programmation.


<head>
<TITLE>Exemple de document</TITLE>
<script>
function dump_props(obj, obj_name) {
    var result= "", i= "";
    for( i in obj)
        result += obj_name + "." + i + " = " 
                  + obj[i] + "<br>\n";
    return result;
}

function ValidateButton(form,varname) {
	var doc="";
	
	doc += dump_props(form,varname);
	CreateMsgWindow("titre",400,150,doc);

}

function FormProc() {
	var doc="";

	doc += "<h2> Structure de <tt> document </tt><hr></h2>";
	doc += dump_props(document,"document");
	doc += "<h2> Structure de <tt> location </tt><hr></h2>";
	doc += dump_props(location,"location");
	doc += "<h2> Structure de <tt> history </tt><hr></h2>";
	doc += dump_props(history,"history");
	doc += "<h2> Structure du formulaire<hr></h2>";
	doc += dump_props(document.myform,"document.myform");

	doc += "<h3> Description du champ de saisie<hr></h3>";
	doc += dump_props(document.myform.text1,"document.myform.text1");

	doc += "<h3> Description de la case a cocher<hr></h3>";
	doc += dump_props(document.myform.Check1,"document.myform.Check1");

	doc += "<h3> Description du bouton<hr></h3>";
	doc += dump_props(document.myform.Button1,"document.myform.Button1");
	CreateMsgWindow("titre",400,150,doc);

}
	
function CreateMsgWindow(Title,Width,Height,doc) {	
	var htmlpage= " ";
    var win_opt= "toolbar=0,location=0,directories=0,status=0,menubar=0,";
	win_opt += "scrollbars=0,resizable=0,copyhistory=0,";
	win_opt += "width=" + Width + ",height=" + Height;

	// Creation de la fenetre
	NewWindow= window.open("","Title",win_opt);
	// Creation de la propriete creator permettant de referencer
	// la fenetre source
	NewWindow.creator= self;

	// Generation du contenu de la page
	NewWindow.document.open();
		
	htmlpage += "<HTML><HEAD><TITLE>" + Title + "</TITLE></HEAD><BODY>";
	htmlpage += doc;
	htmlpage += "<HR><FORM><CENTER>"
	htmlpage += "<INPUT TYPE='button' VALUE='      Close        ' " + 
"onClick='window.close()'>"
	htmlpage += "</CENTER></FORM>";
	htmlpage += "</BODY></HTML>";
	NewWindow.document.write(htmlpage);
	
	NewWindow.document.close();
}
</script>




</head>
<BODY>


<FORM NAME="myform" onSubmit="FormProc()">
<CENTER><TABLE>
<TR> <TD>Saisissez une chaine: 
     <TD> <INPUT TYPE=text NAME="text1" 
                      VALUE="blabla" SIZE=20 >
<TR> <TD>Option a valider: 
     <TD><INPUT TYPE="checkbox" NAME="Check1" CHECKED 
                onClick="ValidateButton(this.form.Check1,'document.myform.Check1')"> Option 
#1
	<TD><INPUT TYPE="checkbox" NAME="Check2"  
                onClick="ValidateButton(this.form.Check2,'document.myform.Check2')"> Option 
#2
<TR> <TD>Boutons 
	<TD><INPUT TYPE="button" NAME="Button1" VALUE="Bouton1" 
       onClick="ValidateButton(this.form.Button1,'document.myform.Button1')">
</TABLE>
<hr>
<INPUT TYPE="submit" VALUE="Validez le formulaire">
</CENTER></FORM>
<HR>

<script>
document.write("<h2> Structure de <tt> document </tt><hr></h2>");
document.write(dump_props(document,"document"));
document.write("<h2> Structure de <tt> location </tt><hr></h2>");
document.write(dump_props(location,"location"));
document.write("<h2> Structure de <tt> history </tt><hr></h2>");
document.write(dump_props(history,"history"));
document.write("<h2> Structure du formulaire<hr></h2>");
document.write(dump_props(document.myform,"document.myform"));

document.write("<h3> Description du champ de saisie<hr></h3>");
document.write(dump_props(document.myform.text1,"document.myform.text1"));

document.write("<h3> Description de la case a cocher<hr></h3>");
document.write(dump_props(document.myform.Check1,"document.myform.Check1"));

document.write("<h3> Description du bouton<hr></h3>");
document.write(dump_props(document.myform.Button1,"document.myform.Button1"));

</script>
</BODY>

Saisissez une chaine:
Option a valider:	Option #1	Option #2
Boutons