Vytvořte si vlastní formulář

Napsal O webu (») 1. 12. 2010 v kategorii Banan.cz, přečteno: 14050×
Zaujalo mě : eetgo.cz = eet zdarma a online

Máme pro Vás další zajímavý tip, jak si vylepšit webové stránky. Tentokrát se podíváme do zákulisí tvorby formulářů.

Co k tomu budete potřebovat:

A) prohlížeč SEAMONKEY (volně ke stažení)
B) doplňek aplikace SEAMONKEY tzv.
SeaMonkey Debug and QA UI (volně ke stažení)

Nyní tedy přistoupíme k tvorbě samotného formuláře.

Chceme např. vytvořit formulář s těmito prvky - jméno, příjmení, pohlaví.

1) V otevřeném "seamonkey" klikňete dole na tzv. composer

C0_2

2) klasickým způsobem vepíšeme na stránku :jméno, poté klikneme na ikonku "debug"-"form"-"form field"

C1

3) do okna vepíšeme "jmeno" a zvolíme velikost pole "field size", např. 10.

C2

4) stejně tak vytvořáme kolonku "příjmení"

5) "pohlaví": opět zvolíme "debug"-"form"-"form field". Místo předdefinovaného textu ("text"), zvolíme variantu "radio button".

C3

Následně do kolonky group name vepíšeme "pohlaví" a do kolonky field value pak "žena"
Poté stejným způsobem vytvoříme pohlaví  "muž"

6) A toto by měl být výsledek:

C4

7) Zbývá jen zkopírovat zdrojový kód (HTML source) ze seamonkey

C5

do HTML webové stránky

C6

9) Aby bylo možné vyplněný formulář odeslat, úplně na konec před něj vepíšeme: {RS:FORM:mailto=} a za něj: {RS:/FORM}

př.

Bod-9b

A Vaše stránky se mohou chlubit krásným formulářemsmile

Hodnocení:     nejlepší   1 2 3 4 5   odpad
Facebook Twitter Topčlánky.cz Linkuj.cz

Komentáře

Zobrazit: standardní | od aktivních | poslední příspěvky | všechno
dvorok z IP 88.81.68.*** | 31.1.2014 11:34
Dobrý den prosím Vás, není nutno když se vkládá text do HTML vyrušit všechny znaky <> aby se grafika správně zobrazovala?
banan.czTomáš Lacina | 31.1.2014 12:13
Dobrý den, pokud vkládáte přímo HTML kód, tak ten znaky <> označuje konkrétní prvek, například <h1> označuje nadpis. Případně se můžete podívat na www.jakpsatweb.cz/ .
dvorok z IP 88.81.68.*** | 22.1.2014 20:04
prosím Vás můžete mi vypsát celý odkaz, jak jsem vložil do HTML doplnění odkazu tak se mi text objevuje v náhledu. Děkuji
<form action="?????????" method="post">
<p>Váš mail: <input name="mail_odesilatele" size="20"><br>
Předmět: <input name="predmet" size="20"><br>
Zpráva: <textarea name="zprava" rows="4" cols="30"></textarea><br>
<input type="submit" value="Odeslat"> </p>
</form>
Jakub Böhm z IP 82.209.8.*** | 22.1.2014 20:35
Tady máte příklad fungujícího formuláře. Vložit je nutné do HTML.
<p>{RS:FORM:mailto=}</p>
<table style="width: 100%;" border="0">
<tbody>
<tr>
<td width="100">Jméno</td>
<td><input class="query full" type="text" name="jmeno" /></td>
</tr>
<tr>
<td width="100">Líbí se Vám web?</td>
<td><select name="libi_web">
<option selected="selected" value="vyborny">výborný</option>
<option value="slusny">slušný</option>
<option value="prumerny">průměrný</option>
</select></td>
</tr>
<tr>
<td width="100">Jste</td>
<td><input id="pohlavi_m" type="radio" name="pohlavi" value="M" checked="checked" /><label for="pohlavi_m">muž</label><br /> <input id="pohlavi_z" type="radio" name="pohlavi" value="Z" /><label for="pohlavi_z">žena</label></td>
</tr>
<tr>
<td width="100"> Text</td>
<td><textarea name="Text" rows="5" cols="10"></textarea></td>
</tr>
</tbody>
</table>
<p>{RS:/FORM}</p>
JaSyK z IP 188.75.144.*** | 30.1.2014 06:49
... ať to čtu jak to čtu, pořád mi tam něco chybí a mám stejný problém, jako človíček ve Vaší komunikaci - zobrazuje se mi {RS:FORM:mailto="ja.sy@seznam.cz"} na začátku a {RS:/FORM} na konci.

Navíc nikde nepopisujete, jak vložit tlačítko odeslat ... na to jsem přišel sám, ale i po zadání všeho to prostě nefunguje ...

Možná by měl mít formulář i nějakou "velikost" a rámeček, což jsou detaily, ale co postrádám - nikde není uvedena možnost zadat podmínku pro vyplnění pole formuláře, tedy že je povinné, jinak se formulář "neodešle" a podobně ...

Co je tedy špatně?

Janek
JaSyK z IP 188.75.144.*** | 30.1.2014 06:51
Ještě doplním - přijde mi, že vy osobně všechny podrobnosti znáte velmi dobře a píšete nám je tak, jako by jsme tomu rozuměli stejně jako vy, ale my jsme zařátečníci, tak by to chtělo trochu víc rozvést do detailů nebo přesně popsat skutečný krok za krokem co a jak udělat ... a věřím, že pak nebudou nutné dotazy a pochopíme vše jak by jsme měli ...
Jakub Drešl z IP 82.209.8.*** | 30.1.2014 07:04
Dobrý dne,
musím konstatovat, že formulář, který doložil kolega opravdu funguje. Právě jsem jej osobně odzkoušel. {RS:FORM:mailto="ja.sy@seznam.cz"} na začátku a {RS:/FORM} na konci se zobrazovat opravdu má, tak je to správně. Ověřit funkčnost formuláře a správnost můžete také pomocí vytvoření předdefinované stránky v redakčním systému pomocí funkce přidat předdefinovanou stránku - formulář.
JaSyK z IP 188.75.144.*** | 30.1.2014 07:24
... ale já chci mít výsledný formulář v prohlížeči (z pozice návštěvníka stránek) bez viditelného {RS:FORM:mailto="ja.sy@seznam.cz"} atd. !!!

Opět odpověď jen na něco a bez další rady ... vy jste odborník a nemáte zájem pomoci laikovi, který se chce něco naučit a vytvořit?

A co ty funkce na povinná pole formuláře, aby nešlo formulář odeslat třeba bez vyplněných kontaktních údajů odesílatele?

A nějaká funkce oznámení formuláře, že byla zpráva odeslána, jako to má mnoho webů standardem ... co to?
Jakub Drešl z IP 82.209.8.*** | 30.1.2014 07:37
Ano, to mi je jasné a výsledný formulář je opravdu z pozice návštěvníka stránek, bez viditelných závorek, které vypisujete. Například zde, jsem vytvořil testovací formulář dle postupu, který jsem Vám popsal výše a tento postup je taktéž stejný postup, který Vám diktoval kolega. kubislav70641.domena3.info/formular . Oznámení o odeslání formuláře tam je automaticky a kontrola je pouze jako sečtení dvou číslic, přesně jako je ve formuláři, který jsem zaslal.
JaSyK z IP 188.75.144.*** | 30.1.2014 07:43
Možná jsem asi debil, ale prostě to nejede a nefachčí, takže ani nevím, zda po odeslání formuláře se formulář opět "vyčistí" pro další zprávu a podobně.

Pokud nechcete, do odpovědí Vás nenutím, ale zde je tedy v SEAMONKEY editoru vytvořený srandovní formulář podle vašich instrukcí včetně instrukcí z tady uvedené komunikace a jak uvidíte, nejede to:

<html>
<head>
{RS:FORM:mailto="ja.sy@seznam.cz"}
<meta http-equiv="content-type" content="text/html;
charset=ISO-8859-2">
<title>Bez názvu</title>
</head>
<body>
<font color="#ff0000"><font face="Calibri"><br>
Jméno<br>
<input size="20" name="Jméno"><br>
<br>
Příjmení<br>
<input size="20" name="Příjmení"><br>
<br>
Telefon<br>
<input size="20" name="Telefon"><br>
<br>
Pohlaví<br>
<input name="Pohlaví" value="žena" type="radio">  žena<br>
<input name="Pohlaví" value="muž" type="radio">  muž<br>
<br>
Chceš se se mnou pomilovat?<br>
<input name="Chceš se se mnou pomilovat?" value="ano"
type="radio"> ANO<br>
<input name="Chceš se se mnou pomilovat?" value="NE"
type="radio"> NE<br>
</font><b><font face="Calibri"><br>
<br>
<input name="Odeslat dotaz" type="submit"><a name="mailto:"ja.sy@seznam.cz">type=" submit" =""=""><br>
<br>
<br>
<br>
</a></font></b></font>
{RS:/FORM}
<br>
<br>
</body>
</html>
Jakub Drešl z IP 82.209.8.*** | 30.1.2014 07:49
Zkuste prosím vyjmout obě části {RS:FORM:mailto= z hlavičky a vložte je prosím do tagu <body> ke zbytku formuláře.
JaSyK z IP 188.75.144.*** | 30.1.2014 07:51
... psal jsem, že jsem debil - proto vaší odpovědi vůbec nerozumím a nevím, jak to udělat ...

Jak jste uvedl odkaz s formulářem, tak jsem se podíval do zdrojáku tohoto vašeho formuláře a zjistil jsem, že styl zápisu je úplně odlišný než ten, který jste nám popsal ...

např. tam máte <form> a pod., ale složenou závorku ani jednu s RS ... atd., je tam mnoho odlišností
Jakub Drešl z IP 82.209.8.*** | 30.1.2014 07:58
V tomto kusu kódu můžete vidět, že RS: FORM je vnořen v tagu <head> --- <html>
<head>
{RS:FORM:mailto="ja.sy@seznam.cz"}
<meta http-equiv="content-type" content="text/html;
charset=ISO-8859-2">
<title>Bez názvu</title>
</head>

<head> je začátek tagu a </head> je konec tagu. Stejný systém funguje i u tagů ostatních. Tedy vy RS FORM vyjměte z tagu <head> a vložte jej na začátek formuláře do tagu <body>... toto udělejte i s druhou částí RS FORM, která je ve spodní části kódu.
JaSyK z IP 188.75.144.*** | 30.1.2014 08:03
... tedy - jedu podle vás a buď jsem maximální debil, nebo nevím kde je chyba:

<html>
<head>
{RS:FORM:mailto="ja.sy@seznam.cz"}
<meta http-equiv="content-type" content="text/html;
charset=ISO-8859-2">
<title>Bez názvu</title>
</head>
<body>
<font color="#ff0000"><font face="Calibri"><br>
Jméno<br>
<input size="20" name="Jméno"><br>
<br>
Příjmení<br>
<input size="20" name="Příjmení"><br>
<br>
Telefon<br>
<input size="20" name="Telefon"><br>
<br>
Pohlaví<br>
<input name="Pohlaví" value="žena" type="radio">  žena<br>
<input name="Pohlaví" value="muž" type="radio">  muž<br>
<br>
Chceš se se mnou pomilovat?<br>
<input name="Chceš se se mnou pomilovat?" value="ano"
type="radio"> ANO<br>
<input name="Chceš se se mnou pomilovat?" value="NE"
type="radio"> NE<br>
</font><b><font face="Calibri"><br>
<br>
<input name="Odeslat dotaz" type="submit"><a name="mailto="ja.sy@seznam.cz">type=" submit" =""=""><br>
<br>
<br>
<br>
</a></font></b></font>
</form>
</body>
<head>
{RS:/FORM}
</head>
</html>

Zajímalo by mě, jak Vám se to zobrazuje !!!

A nefunguje to!
banan.czTomáš Lacina | 30.1.2014 08:17
Dobrý den,
{RS:FORM:mailto="ja.sy@seznam.cz"} musí být umístěno pod <body>, nikoli pod <head> .
JaSyK z IP 188.75.144.*** | 30.1.2014 08:30
Napsal jste mi doslovně - cituji:

5.10. Re: formulář »
Jakub Drešl z IP 82.209.8.*** | 30.1.2014 07:58
V tomto kusu kódu můžete vidět, že RS: FORM je vnořen v tagu <head> --- <html>
<head>
{RS:FORM:mailto="ja.sy@seznam.cz"}
<meta http-equiv="content-type" content="text/html;
charset=ISO-8859-2">
<title>Bez názvu</title>
</head>

a tam o <body> nic psáno není !!!

Nebude rychlejší, když mi ten zápis, co jsem se vkopíroval, opravíte a pošlete tak, jak má být a z toho to uvidím jasněji?

A nenapsal jste mi, jak vám se to pak zobrazuje a klidně zkuste odeslat formulář na můj mail ja.sy@seznam.cz ať vidím, zda to dojde či nikoli ...

Ale doteď to prostě nechodí !!!!!!!!!!!!!!

Pošlete mi tedy ten můj zápis opravený, abych viděl, jak to má být a z toho to prostě pochopím?

Fakt jsem debil ... a začátečník !!!
banan.czTomáš Lacina | 30.1.2014 08:38
Dobrý den,  prosím o konkrétní stránku, kde máte daný formulář umístěn.
JaSyK z IP 188.75.144.*** | 30.1.2014 08:40
spedice.okamzite.eu/formular.html

Jinak stránky dělám přes WebPage Maker a do stránek vkládám html kód ... tedy i to, co jsem Vám napsal
JaSyK z IP 188.75.144.*** | 30.1.2014 08:52
Už jste se díval na stránku spedice.okamzite.eu/formular.html ?

Je to tam tak, jak jsem vám to popsal - a i když se teď formulář najednou "odešle" a políčka formuláře se "vyčistí", na mail to prostě nedojde a graficky je vidět RS FORM ve složených závorkách atd., což nechci ...

Už mi napíšete zdrojový kód, jak to má vypadat prosím, ať neztrácíme oba čas?

Díky.
banan.czTomáš Lacina | 30.1.2014 09:15
Dobrý den, daný kód (RS:FORM) je definován v rámci našeho redakčního systému, pokud jej tedy nevyužíváte, tak je potřeba si zadat vlastní skript pro odesílání, děkuji za pochopení.
dvorok z IP 88.81.68.*** | 22.1.2014 21:19
Ano to jsem udělal, ale místo grafiky se mi objevuje text. Podívejte se na tento odkaz bdostrava.unas.cz/komerce_soubory/sms.htm
Jakub Böhm z IP 82.209.8.*** | 22.1.2014 21:30
Je důležité soubor uložit ve formátu HTML. Také by měl formát html začít a končit tagem
<html>
  <head>
  </head>

  <body>
  umístění formuláře.
  </body>

</html>

Kde vložíte formulář např. zde. do mailto= uveďte email do uvozovek, kam se má formulář odeslat.
dvorok z IP 88.81.68.*** | 22.1.2014 20:45
Jsem blbý, vkládám stránky přes Mikrosoft FrontPage a po vložení odkazu se neobjeví tabulka, ale text, už jsem z toho blázen, nemá se z textu něco odstranit? nebo přidat? Snad naposled díky
Jakub Böhm z IP 82.209.8.*** | 22.1.2014 21:09
pokud tvoříte v grafickém rozhraní zkontrolujte si prosím vkládání. Pokud v HTML rozhraní přepněte poté z HTML do grafické podoby a podívejte se na chyby. Podle toho dál zjistíte, kde by měla být potencionální chyba.
dvorok z IP 88.81.68.*** | 22.1.2014 14:27
Dobrý den, mám v HTML tento odkaz:
<form action="?????????" method="post">
<p>Váš mail: <input name="mail_odesilatele" size="20"><br>
Předmět: <input name="predmet" size="20"><br>
Zpráva: <textarea name="zprava" rows="4" cols="30"></textarea><br>
<input type="submit" value="Odeslat"> </p>
</form>
Prosím, kde mám napsat: Aby bylo možné vyplněný formulář odeslat, úplně na konec před něj vepíšeme: {RS:FORM:mailto=} a za něj: {RS:/FORM}
Děkuji
banan.czTomáš Lacina | 22.1.2014 15:01
Dobrý den, {RS:FORM:mailto=} vložíte před úplný začátek formuláře a {RS:/FORM} na jeho konec.
dvorok z IP 88.81.68.*** | 22.1.2014 19:46
Nefunguje to!!!
Jakub Böhm z IP 82.209.8.*** | 22.1.2014 19:54
Dobrý den, zkontrolujte si prosím, jestli jste uvedl v nastavení správný email, případně za mailto="email@email.cz"  dosadit email, na který má být formulář odeslán.
Kat z IP 89.24.148.*** | 23.1.2013 19:51
Dobrý den, potřebuji stáhnout SeaMonkey Debug and QA UI, ale neustále mi to hlásí, že není kompatibilní s Mozillou... Můžete prosím někdo poradit, co s tím?
Kutlák z IP 82.209.8.*** | 23.1.2013 21:21
Dobrý den, problém by mohl být v kompatibilitě doplňku. Koukněte na nápovědu addonu a porovnejte se současnou verzí FF prohlížeče.
jeseter z IP 85.70.198.*** | 11.10.2012 11:56
Na stránkách bone.bloger.cz nabízí člověk tipy na fotbalové poločasy za peníze. Nenaleťte mu a nic mu neposílejte,nikdy vám nepošle slibované výherní tipy v kurzu který nabízel. Přesto,že jeho tikety z fortuny vypadají krásně,vy se k takovým nedostanete
ahasweb z IP 82.208.4.*** | 2.12.2010 13:52
na ikonku "debug"-"form"-"form fielf" - na ikonku "debug"-"form"-"form field"
pole "filed size", např. 10. - pole "field size", např. 10.
stejně tak vytvořáme kolonku  - stejně tak vytvoříme kolonku
zvolíme "debug"-"form"-"form fielf" - zvolíme "debug"-"form"-"form field"
zvolíme variantu "ratio buttom" - zvolíme variantu "radio button"
Zdraví Jan Bílek - www.ahasweb.cz


Nový komentář

Téma:
Jméno:
Notif. e-mail *:
Komentář:
[*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*]   [b] [obr]
Odpovězte prosím číslicemi: Součet čísel sedm a jedenáct