Navigace

Hlavní menu

 

Submenu

 

Okno pro licenční podmínky na webové stránce

Někdy potřebujeme potvrzení uživatele o tom, že souhlasí s našimi podmínkami. Z instalačních programů známe okno, ve kterém jsou zobrazeny licenční podmínky a pod nimi zatrhávací políčko pro potvrzení souhlasu. Dole je potom tlačítko pro pokračování, které je do okamžiku, než zatrhneme souhlas, nedostupné.

Pro naši aplikaci použijeme formulář. Zde totiž můžeme použít pole textarea, do kterého přímo vypíšeme naše podmínky. Nelze sice použít formátování textu, ovšem pro náš účel to není nutné. Výhodou je, že nemusí být ve stránce celé podmínky najednou, rozměry pole si libovolně nastavíme a zobrazený text podmínek lze v poli rolovat, a to ve všech prohlížečích. Ve vlastnostech pole textarea můžeme nastavit také atribut readonly (ve většině prohlížečů nebude možné údaje editovat) a wrap="virtual" (flexibilní zalamování textu).

Pod textové pole umístíme zatrhávací políčko, které bude obsluhovat JavaScript ve stránce. Jeho hodnota by se měla testovat i v PHP skriptu, který obsluhuje náš formulář.

Nakonec si přidáme libovolný počet tlačítek pro pokračování po souhlasu s podmínkami. Každé tlačítko bude mít výchozí vlastnost disabled, takže nebude ihned po zobrazení stránky dostupné. V některých starších prohlížečích je tato vlastnost ignorována, proto je potřeba s tím počítat ve funkci obsluhující zatrhávací políčko.

Obslužný skript bude testovat stav zatrhávacího políčka a při zatržení změní vlastnost všech tlačítek, která jsou typu submit na enabled. V prohlížečích, které to nepodporují, bude alternativně stornováno odeslání formuláře a pomocí alert bude zobrazeno hlášení o nutnosti souhlasu s podmínkami. Výhodou je, že můžeme přidat více odesílacích tlačítek s různými funkcemi, aniž bychom museli zvlášť zasahovat do obslužného skriptu. Viz ukázka.

Stránka rules.htm:

<html>
<head>
<title>Licenční podmínky</title>
<script language="JavaScript">
<!--
var objname

function agsubmit(el){ // funkce, která povolí všechna tlačítka v závislosti na stavu zatrhávacího políčka
  objname=el
  if (document.all||document.getElementById){
    for (i=0;i<objname.form.length;i++){
      var tempobj=objname.form.elements[i]
      if (tempobj.type.toLowerCase()=="submit")
        tempobj.disabled=!objname.checked
    }
  }
}

function defaultagree(el){ // funkce, která rozliší, zda prohlížeč podporuje zakázání tlačítka
  if (!document.all&&!document.getElementById){
    if (window.objname&&objname.checked)
      return true
    else{
      alert("Pro pokračování musíte souhlasit s podmínkami")
      return false
    }
  }
}
// -->
</script>
</head>
<body>

<form action="skript.php" name="rulesform" onSubmit="return defaultagree(this)" method="post"> // v onsubmit se volá funkce pro podporu starších prohlížečů
<textarea readonly rows="6" cols="30" wrap="virtual">
1. první pravidlo je takové a takové

2. musíte to a to a to

3. nesmíte vůbec nic

4. nedáváme žádné záruky

5. je možné, že se to pokazí
</textarea><br />
<input name="rulesagree" value="1" type="checkbox" onClick="agsubmit(this)"> Souhlasím s licenčními podmínkami<br /> // v onclick se volá funkce, která v novějších browserech povolí zakázaná tlačítka
<input type="Submit" value="Další &gt;" disabled> // při načtení stránky je tlačítko v novějších prohlížečích zakázáno - disabled
<input name="print" type="Submit" value="Pokračovat a vytisknout &gt;" disabled>
</form>
</body>
</html>

Za zmínku ještě stojí použití metody post pro odeslání formuláře. Metoda post přenášená data nepředává do řetězce URL. Tím zabráníme uživatelům, aby si chráněnou stránku uložili například do oblíbených odkazů v podobě přímého odkazu.

Z formuláře se odešle pouze hodnota zatrhávacího políčka a těch tlačítek, u kterých uvedeme atribut name. Pole textarea není pojmenované, takže se jeho obsah neodesílá. Je úlohou zpracovávajícího skriptu, aby otestoval hodnotu proměnné zatrhávacího políčka (v našem příkladu rulesagree). Pokud jeho hodnota není rovna 1 (true), měl by zobrazit upozornění na nutnost souhlasu s podmínkami a případně ještě odkaz na příslušný formulář.

V PHP by to bylo například takto:

if ($rulesagree!=1)
  echo "Bohužel jste nepotvrdil(a) souhlas s <a href=\"rules.html\">podmínkami</a>.";
else {
  zde je kód stránky v případě, že je souhlas potvrzen
}

Tuto jednoduchou aplikaci si můžete stáhnout i s ukázkou obslužného skriptu pro PHP.

Růžička, Pavel (15.5. 2002)
odborný redaktor Interval.cz
Diskuze: Okno pro licenční podmínky na webové stránce
2002-05-15 13:24:16P.DvorakTakto to nedelejte!
2002-05-15 18:03:30Pavel RůžičkaTakto to nedelejte!
2003-05-08 20:23:03debITtakova drobnost