Gestion de formulaire comme sous visual basic

Contenu du snippet

Ce script permet de créer un formulaire réellement dynamique, dans le même esprit que Visual Basic.
Il a pour but de fonctionner dans des plateforme fixe (Intranet avec Client sous IE 5.5), pour les autres, il faut l'adapter.

Il permet donc par une Checkbox d'activer ou désactiver des cases à remplir.

Source / Exemple :


'Dans votre code, sous le body :
<SCRIPT>

//-----------------------------------------------------------------------------------------------------
function cocheMatin()
{
	if (document.Oubli_badge.matincoche.value == "0")
	{
		document.Oubli_badge.heuredebutmatin.disabled=false;
		document.Oubli_badge.minutedebutmatin.disabled=false;
		document.Oubli_badge.heurefinmatin.disabled=false;
		document.Oubli_badge.minutefinmatin.disabled=false;
		document.Oubli_badge.heuredebutmatin.style.background ="FFFFFF";
		document.Oubli_badge.minutedebutmatin.style.background ="FFFFFF";
		document.Oubli_badge.heurefinmatin.style.background ="FFFFFF";
		document.Oubli_badge.minutefinmatin.style.background ="FFFFFF";
		document.Oubli_badge.heuredebutmatin.value="";
		document.Oubli_badge.minutedebutmatin.value="";
		document.Oubli_badge.heurefinmatin.value="";
		document.Oubli_badge.minutefinmatin.value="";
		document.Oubli_badge.matincoche.value = "1";
	}
	else 
	{
		document.Oubli_badge.heuredebutmatin.disabled=true;
		document.Oubli_badge.minutedebutmatin.disabled=true;
		document.Oubli_badge.heurefinmatin.disabled=true;
		document.Oubli_badge.minutefinmatin.disabled=true;
		document.Oubli_badge.heuredebutmatin.style.background ="C0C0C0";
		document.Oubli_badge.minutedebutmatin.style.background ="C0C0C0";
		document.Oubli_badge.heurefinmatin.style.background ="C0C0C0";
		document.Oubli_badge.minutefinmatin.style.background ="C0C0C0";
		document.Oubli_badge.heuredebutmatin.value="";
		document.Oubli_badge.minutedebutmatin.value="";
		document.Oubli_badge.heurefinmatin.value="";
		document.Oubli_badge.minutefinmatin.value="";
		document.Oubli_badge.matincoche.value = "0";
	}
	
};

//-----------------------------------------------------------------------------------------------------
function cocheSoir()
{
	if (document.Oubli_badge.soircoche.value == "0")
	{
		document.Oubli_badge.heuredebutsoir.disabled=false;
		document.Oubli_badge.minutedebutsoir.disabled=false;
		document.Oubli_badge.heurefinsoir.disabled=false;
		document.Oubli_badge.minutefinsoir.disabled=false;
		document.Oubli_badge.heuredebutsoir.style.background ="FFFFFF";
		document.Oubli_badge.minutedebutsoir.style.background ="FFFFFF";
		document.Oubli_badge.heurefinsoir.style.background ="FFFFFF";
		document.Oubli_badge.minutefinsoir.style.background ="FFFFFF";
		document.Oubli_badge.heuredebutsoir.value="";
		document.Oubli_badge.minutedebutsoir.value="";
		document.Oubli_badge.heurefinsoir.value="";
		document.Oubli_badge.minutefinsoir.value="";
		document.Oubli_badge.soircoche.value = "1";
	}
	else
	{
		document.Oubli_badge.heuredebutsoir.disabled=true;
		document.Oubli_badge.minutedebutsoir.disabled=true;
		document.Oubli_badge.heurefinsoir.disabled=true;
		document.Oubli_badge.minutefinsoir.disabled=true;
		document.Oubli_badge.heuredebutsoir.style.background ="C0C0C0";
		document.Oubli_badge.minutedebutsoir.style.background ="C0C0C0";
		document.Oubli_badge.heurefinsoir.style.background ="C0C0C0";
		document.Oubli_badge.minutefinsoir.style.background ="C0C0C0";
		document.Oubli_badge.heuredebutsoir.value="";
		document.Oubli_badge.minutedebutsoir.value="";
		document.Oubli_badge.heurefinsoir.value="";
		document.Oubli_badge.minutefinsoir.value="";
		document.Oubli_badge.soircoche.value = "0";
	}
	
};
//-----------------------------------------------------------------------------------------------------

</SCRIPT>

'Dans le formulaire 

<FORM name="Oubli_badge" method="POST">
<INPUT Type="text" name=Date>
      <TABLE cellSpacing=0 cellPadding=0 align=left border=0>
        <TR>
          <TD width=250><blockquote><FONT class=TITRE2>&nbsp;
	  <INPUT type=hidden name=matincoche value="0">

          <INPUT type=checkbox name=MatinBox onclick='javascript:cocheMatin();'>Matin</FONT><BR></blockquote> </TD>
	</TR>
	<TR>
	  <TD></TD>
          <TD width=150>Arrivée le Matin : </TD>
          <TD>
          <DIV align=right><INPUT style="text-color:black;background='C0C0C0';" maxLength=2 size=2 name='heuredebutmatin' disabled>&nbsp;:&nbsp;</DIV></TD>
          <TD><INPUT style="text-color: black;background='C0C0C0';" maxLength=2 size=2 name='minutedebutmatin' disabled></TD>
          <TD width=50>&nbsp;</TD>
          <TD width=150>Départ le Matin :</TD>
          <TD>
            <DIV align=right><INPUT style="text-color:black;background='C0C0C0';" maxLength=2 size=2 name='heurefinmatin' disabled>&nbsp;:&nbsp;</DIV></TD>
          <TD><INPUT style="text-color: black;background='C0C0C0';" maxLength=2 size=2 name='minutefinmatin' disabled></TD>
          <TD width=50>&nbsp;&nbsp;&nbsp;<A href="javascript:if(document.Oubli_badge.MatinBox.checked){heureMatin()};"><font color='navy'>Matin</font></A></TD></TR>
	<TR><TD>&nbsp;</TD></TR>
        <TR>
          <TD width=250><blockquote><FONT class=TITRE2>&nbsp;
          <INPUT type=hidden name="soircoche" value="0">
          <INPUT type=checkbox name=SoirBox onclick='javascript:cocheSoir();'>Après Midi</FONT><BR></blockquote></TD>
 	</TR>
	<TR>
	  <TD></TD>
          <TD width=150>Arrivée l'après-Midi : </TD>
          <TD>
            <DIV align=right><INPUT style="text-color: black;background='C0C0C0';" maxLength=2 size=2 name='heuredebutsoir' disabled>&nbsp;:&nbsp;</DIV></TD>
          <TD><INPUT style="text-color: black;background='C0C0C0';" maxLength=2 size=2 name='minutedebutsoir' disabled></TD>
          <TD width=50>&nbsp;</TD>
          <TD width=150>Départ l'après-Midi :</TD>
          <TD>
            <DIV align=right><INPUT style="text-color: black;background='C0C0C0';" maxLength=2 size=2 name='heurefinsoir' disabled>&nbsp;:&nbsp;</DIV></TD>
          <TD><INPUT style="text-color: black;background='C0C0C0';" maxLength=2 size=2 name='minutefinsoir' disabled></TD>
          <TD width=50>&nbsp;&nbsp;&nbsp;<A href="javascript:if(document.Oubli_badge.SoirBox.checked){heureSoir()};"><font color='navy'>Soir</font></A>
          </TD>
   </TD>
</TR>
</TABLE>
</TD>
</TR>
<TR><TD>
<INPUT Type='hidden' name='Ajout_Oubli' value='1'>
<BR><BR><BR><BR>
<CENTER><A href="javascript:ControlForm();"><IMG src="../images/valider.gif" width=61 border=0></A> 
</CENTER>
</TD>
</TR></TABLE>
</FORM>

' Bref à adapter à votre demande.

Conclusion :


Bon coding.

Romelard Fabrice (Alias F___)

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.