Autor Zpráva
merlinok
Profil
#1 · Zasláno: 4. 8. 2008, 23:18:15 · Upravil/a: merlinok
Odpovědět Citovat
Dobrý den,
potřeboval bych pomoc s jednou stránkou kterou používám na registraci. 

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<title>Registrace</title>
</head>
<form name="registace" method="POST" action="phpSecurePages/process.php">
  <table width="75%" border="1" cellspacing="0" cellpadding="0" align="center">
    <tr valign="middle"> 
      <td colspan="2" bgcolor="#FFFFCC"> 
        <div align="center"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2">Registrace 
        </font></b></div>
    </td>
  </tr>
    <tr valign="middle"> 
      <td colspan="2"><font face="Verdana, Arial, Helvetica, sans-serif" size="2">* 
        Políčka <font color="#990000">červeně</font> je nutno vyplnit</font></td>
  </tr>
    <tr valign="middle"> 
      <td width="17%" bgcolor="#CCCCCC"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#990000">Jméno</font></b></td>
      <td width="83%"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2">
        &nbsp;<input type="text" name="username" size="20" maxlength="20">
        </font></b></td>
  </tr>
    <tr valign="middle"> 
      <td width="17%" bgcolor="#CCCCCC"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#990000">Heslo</font></b></td>
      <td width="83%"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2">
        &nbsp;<input type="password" name="password" size="20" maxlength="20">
        </font></b></td>
  </tr>
      <tr valign="middle"> 
      <td width="17%" bgcolor="#CCCCCC"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#990000">Postava</font></b></td>
      <td width="83%"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2">
        &nbsp;Vyberte si Rasu a Povolání
        </font></b></td>
  </tr>
      <tr valign="middle"> 
      <td width="17%" bgcolor="#CCCCCC"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#990000">Rasa</font></b></td>
      <td width="83%">
      <b><font face="Verdana, Arial, Helvetica, sans-serif" size="2">
        &nbsp;<select name="rasa" size="6">
              <option value="Člověk">Člověk
              <option value="Skřet">Skřet
              <option value="Elf">Elf
              <option value="Ork">Ork
              <option value="Temný elf">Temný Elf
              <option value="Trpaslík">Trpaslík
              </select>
        </font></b></td>
  </tr>
      <tr valign="middle"> 
      <td width="17%" bgcolor="#CCCCCC"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#990000">Povolání</font></b></td>
      <td width="83%">
      
      <b><font face="Verdana, Arial, Helvetica, sans-serif" size="2">
        &nbsp;<select name="job" size="9">
              <option value="Kouzelník">Kouzelník
              <option value="Nekromant">Nekromant
              <option value="Lovec">Lovec
              <option value="Vrah">Vrah
              <option value="Barbar">Barbar
              <option value="Paladin">Paladin
              <option value="Upír">Upír
              <option value="Vlkodlak">Vlkodlak
              <option value="Dělník">Dělník
              </select>
        </font></b></td>
  </tr>
    <tr valign="middle"> 
      <td colspan="2" bgcolor="#FFFFCC">
        <div align="center"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2"></font></b><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2"> 
          <input type="submit" name="Submit" value="Submit">&nbsp;
          <input type="reset" name="Reset" value="Reset">
          </font></b></div>
      </td>
  </tr>
</table>
</form>
</body>
</html>

Když se na to podíváte tak je to normální formulář v tabulce. Můj problém spočívá vtom, že když kliknu třeba na člověk tak by se vedle toho měl objevit text o té rase.
Když potom kliknu na jakékoli povolání tak aby se vedle povolání objevil další text o povolání.
Snad mě chápete a pomůžete.
pmg
Profil
#2 · Zasláno: 5. 8. 2008, 01:29:11
Odpovědět Citovat
1. Do hlavičky (<head>) vlož 
<script type="text/javascript">
var postava = {
	'Člověk': 'Popis člověka.',
	'Skřet': 'Popis skřeta.',
	'Elf': 'Popis elfa.',
	'Ork': 'Popis orka.',
	'Temný elf': 'Popis temného elfa.',
	'Trpaslík': 'Popis trpaslíka.'
}

function describe(element, titles, target) {
	target = document.getElementById(target);
	var title = titles[element.value];
	target.innerHTML = title ? title : '';
};
</script>


2. Do selektu pro výběr osoby přidej atribut onchange takto:
<select name="rasa" size="6" onchange="describe(this, postava, 'popis')">

3. Přidej do tabulky další (prázdnou) buňku, ve které se má zobrazit popis.

<td id="popis"></td>

Pokud to chceš uvnitř buňky, použij <div id="popis"></div>. Důležité je ale to id="popis".

4. Když budeš chtít popis i pro povolání, zkopíruj to var postava = { ... }; z bodu 1. Text postava změň na povolani a doplň potřebné popisky. Podle bodu 2 uprav druhý select, ale místo describe(this, postava, 'popis') napiš describe(this, povolani, 'popis2'); třetí krok obdobně, jen id="popis2".

Půjde to?
merlinok
Profil
#3 · Zasláno: 5. 8. 2008, 01:40:40
Odpovědět Citovat
Tak mi to funguje skvěle, až na to že se mi ta nová buňka objeví vždy úplně na pravo a né hned vedle výběru ale vytvoří se nový sloupec (vpravo)
merlinok
Profil
#4 · Zasláno: 5. 8. 2008, 01:48:23
Odpovědět Citovat
Tak jsem to předělal přes Microsoft Word a funguje to skvěle... teď si to jen optimalizuju pro moji starou verzi (neupravenou wordem)...
Mockrát ti děkuji, sám bych na to nepřišel.
merlinok
Profil
#5 · Zasláno: 5. 8. 2008, 01:56:22
Odpovědět Citovat
nevím proč ale tenhle kód co mi vyhodil word je trochu divnej... 

<html xmlns:v="urn:schemas-microsoft-com:vml"

xmlns:o="urn:schemas-microsoft-com:office:office"

xmlns:w="urn:schemas-microsoft-com:office:word"

xmlns="http://www.w3.org/TR/REC-html40">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />



<head>

<meta http-equiv=Content-Type content="text/html; charset=utf-8">

<meta name=ProgId content=Word.Document>

<meta name=Generator content="Microsoft Word 11">

<meta name=Originator content="Microsoft Word 11">

<link rel=File-List href="registrace_soubory/filelist.xml">

<link rel=Edit-Time-Data href="registrace_soubory/editdata.mso">

<!--[if !mso]>

<style>

v\:* {behavior:url(#default#VML);}

o\:* {behavior:url(#default#VML);}

w\:* {behavior:url(#default#VML);}

.shape {behavior:url(#default#VML);}

</style>

<![endif]-->

<title>Registrace</title>

<!--[if gte mso 9]><xml>

 <o:DocumentProperties>

  <o:Author>AVALON</o:Author>

  <o:LastAuthor>AVALON</o:LastAuthor>

  <o:Revision>2</o:Revision>

  <o:TotalTime>1</o:TotalTime>

  <o:Created>2008-08-04T23:44:00Z</o:Created>

  <o:LastSaved>2008-08-04T23:46:00Z</o:LastSaved>

  <o:Pages>1</o:Pages>

  <o:Words>57</o:Words>

  <o:Characters>342</o:Characters>

  <o:Company>DOMA</o:Company>

  <o:Lines>2</o:Lines>

  <o:Paragraphs>1</o:Paragraphs>

  <o:CharactersWithSpaces>398</o:CharactersWithSpaces>

  <o:Version>11.5606</o:Version>

 </o:DocumentProperties>

</xml><![endif]--><!--[if gte mso 9]><xml>

 <w:WordDocument>

  <w:SpellingState>Clean</w:SpellingState>

  <w:GrammarState>Clean</w:GrammarState>

  <w:FormsDesign/>

  <w:HyphenationZone>21</w:HyphenationZone>

  <w:ValidateAgainstSchemas/>

  <w:SaveIfXMLInvalid>false</w:SaveIfXMLInvalid>

  <w:IgnoreMixedContent>false</w:IgnoreMixedContent>

  <w:AlwaysShowPlaceholderText>false</w:AlwaysShowPlaceholderText>

  <w:BrowserLevel>MicrosoftInternetExplorer4</w:BrowserLevel>

 </w:WordDocument>

</xml><![endif]--><!--[if gte mso 9]><xml>

 <w:LatentStyles DefLockedState="false" LatentStyleCount="156">

 </w:LatentStyles>

</xml><![endif]-->

<style>

<!--

 /* Font Definitions */

 @font-face

	{font-family:Verdana;

	panose-1:2 11 6 4 3 5 4 4 2 4;

	mso-font-charset:238;

	mso-generic-font-family:swiss;

	mso-font-pitch:variable;

	mso-font-signature:536871559 0 0 0 415 0;}

 /* Style Definitions */

 p.MsoNormal, li.MsoNormal, div.MsoNormal

	{mso-style-parent:"";

	margin:0cm;

	margin-bottom:.0001pt;

	mso-pagination:widow-orphan;

	font-size:12.0pt;

	font-family:"Times New Roman";

	mso-fareast-font-family:"Times New Roman";}

@page Section1

	{size:595.3pt 841.9pt;

	margin:70.85pt 70.85pt 70.85pt 70.85pt;

	mso-header-margin:35.4pt;

	mso-footer-margin:35.4pt;

	mso-paper-source:0;}

div.Section1

	{page:Section1;}

-->

</style>

<!--[if gte mso 10]>

<style>

 /* Style Definitions */

 table.MsoNormalTable

	{mso-style-name:"Normální tabulka";

	mso-tstyle-rowband-size:0;

	mso-tstyle-colband-size:0;

	mso-style-noshow:yes;

	mso-style-parent:"";

	mso-padding-alt:0cm 5.4pt 0cm 5.4pt;

	mso-para-margin:0cm;

	mso-para-margin-bottom:.0001pt;

	mso-pagination:widow-orphan;

	font-size:10.0pt;

	font-family:"Times New Roman";

	mso-ansi-language:#0400;

	mso-fareast-language:#0400;

	mso-bidi-language:#0400;}

</style>

<![endif]-->

<script  type="text/javascript">

var postava = {

	'Člověk': 'Popis člověka.',

	'Skřet': 'Popis skřeta.',

	'Elf': 'Popis elfa.',

	'Ork': 'Popis orka.',

	'Temný elf': 'Popis temného elfa.',

	'Trpaslík': 'Popis trpaslíka.'

}



function describe(element, titles, target) {

	target = document.getElementById(target);

	var title = titles[element.value];

	target.innerHTML = title ? title : '';

};

</script>

<!--[if gte mso 9]><xml>

 <o:shapedefaults v:ext="edit" spidmax="1026"/>

</xml><![endif]--><!--[if gte mso 9]><xml>

 <o:shapelayout v:ext="edit">

  <o:idmap v:ext="edit" data="1"/>

 </o:shapelayout></xml><![endif]-->

</head>



<body lang=CS style='tab-interval:35.4pt'>



<div class=Section1>



<form action="phpSecurePages/process.php" method=POST

enctype="application/x-www-form-urlencoded">



<div align=center>



<table class=MsoNormalTable border=1 cellspacing=0 cellpadding=0 width="75%"

 style='width:75.0%;mso-cellspacing:0cm;mso-padding-alt:0cm 0cm 0cm 0cm'>

 <tr style='mso-yfti-irow:0;mso-yfti-firstrow:yes;mso-row-margin-right:.4%' >

  <td width="99%" colspan=3 style='width:99.6%;background:#FFFFCC;padding:0cm 0cm 0cm 0cm'>

  <p class=MsoNormal align=center style='text-align:center'><b><span

  style='font-size:10.0pt;font-family:Verdana'>Registrace </span></b></p>

  </td>

  <td style='mso-cell-special:placeholder;border:none;padding:0cm 0cm 0cm 0cm'

  width="0%"><p class='MsoNormal'>&nbsp;</td>

 </tr>

 <tr style='mso-yfti-irow:1;mso-row-margin-right:.4%'>

  <td width="99%" colspan=3 style='width:99.6%;padding:0cm 0cm 0cm 0cm'>

  <p class=MsoNormal><span style='font-size:10.0pt;font-family:Verdana'>*

  Políčka <span style='color:#990000'>červeně</span> je nutno vyplnit</span></p>

  </td>

  <td style='mso-cell-special:placeholder;border:none;padding:0cm 0cm 0cm 0cm'

  width="0%"><p class='MsoNormal'>&nbsp;</td>

 </tr>

 <tr style='mso-yfti-irow:2;mso-row-margin-right:.4%'>

  <td width="16%" style='width:16.94%;background:#CCCCCC;padding:0cm 0cm 0cm 0cm'>

  <p class=MsoNormal><b><span style='font-size:10.0pt;font-family:Verdana;

  color:#990000'>Jméno</span></b></p>

  </td>

  <td width="82%" colspan=2 style='width:82.66%;padding:0cm 0cm 0cm 0cm'>

  <p class=MsoNormal><b><span style='font-size:10.0pt;font-family:Verdana'>&nbsp;<INPUT TYPE="text" MAXLENGTH="20" SIZE="20" NAME="username">

  </span></b></p>

  </td>

  <td style='mso-cell-special:placeholder;border:none;padding:0cm 0cm 0cm 0cm'

  width="0%"><p class='MsoNormal'>&nbsp;</td>

 </tr>

 <tr style='mso-yfti-irow:3;mso-row-margin-right:.4%'>

  <td width="16%" style='width:16.94%;background:#CCCCCC;padding:0cm 0cm 0cm 0cm'>

  <p class=MsoNormal><b><span style='font-size:10.0pt;font-family:Verdana;

  color:#990000'>Heslo</span></b></p>

  </td>

  <td width="82%" colspan=2 style='width:82.66%;padding:0cm 0cm 0cm 0cm'>

  <p class=MsoNormal><b><span style='font-size:10.0pt;font-family:Verdana'>&nbsp;<INPUT TYPE="password" MAXLENGTH="20" SIZE="20" NAME="password">

  </span></b></p>

  </td>

  <td style='mso-cell-special:placeholder;border:none;padding:0cm 0cm 0cm 0cm'

  width="0%"><p class='MsoNormal'>&nbsp;</td>

 </tr>

 <tr style='mso-yfti-irow:4;mso-row-margin-right:.4%'>

  <td width="16%" style='width:16.94%;background:#CCCCCC;padding:0cm 0cm 0cm 0cm'>

  <p class=MsoNormal><b><span style='font-size:10.0pt;font-family:Verdana;

  color:#990000'>Postava</span></b></p>

  </td>

  <td width="82%" colspan=2 style='width:82.66%;padding:0cm 0cm 0cm 0cm'>

  <p class=MsoNormal><b><span style='font-size:10.0pt;font-family:Verdana'>&nbsp;Vyberte

  si Rasu a Povolání </span></b></p>

  </td>

  <td style='mso-cell-special:placeholder;border:none;border-bottom:outset 1.0pt'

  width="0%"><p class='MsoNormal'>&nbsp;</td>

 </tr>

 <tr style='mso-yfti-irow:5'>

  <td width="16%" style='width:16.94%;background:#CCCCCC;padding:0cm 0cm 0cm 0cm'>

  <p class=MsoNormal><b><span style='font-size:10.0pt;font-family:Verdana;

  color:#990000'>Rasa</span></b></p>

  </td>

  <td width="32%" style='width:32.26%;padding:0cm 0cm 0cm 0cm'>

  <p class=MsoNormal><b><span style='font-size:10.0pt;font-family:Verdana'>&nbsp;<SELECT NAME="rasa" SIZE="6"

  onchange="describe(this, postava, 'popis')">

<OPTION VALUE="Člověk">Člověk

<OPTION VALUE="Skřet">Skřet

<OPTION VALUE="Elf">Elf

<OPTION VALUE="Ork">Ork

<OPTION VALUE="Temn&yacute; elf">Temn
merlinok
Profil
#6 · Zasláno: 5. 8. 2008, 01:57:12
Odpovědět Citovat 
<OPTION VALUE="Temn&yacute; elf">Temn&yacute; Elf
<OPTION VALUE="Trpasl&iacute;k">Trpasl&iacute;k
</SELECT>
  </span></b><o:p></o:p></p>
  </td>
  <td width="50%" style='width:50.4%;padding:0cm 0cm 0cm 0cm' id=popis>
  <p class=MsoNormal><o:p>&nbsp;</o:p></p>
  </td>
  <td width="0%" style='width:.4%;padding:0cm 0cm 0cm 0cm'>
  <p class=MsoNormal><o:p>&nbsp;</o:p></p>
  </td>
 </tr>
 <tr style='mso-yfti-irow:6'>
  <td width="16%" style='width:16.94%;background:#CCCCCC;padding:0cm 0cm 0cm 0cm'>
  <p class=MsoNormal><b><span style='font-size:10.0pt;font-family:Verdana;
  color:#990000'>Povolání</span></b></p>
  </td>
  <td width="32%" style='width:32.26%;padding:0cm 0cm 0cm 0cm'>
  <p class=MsoNormal><b><span style='font-size:10.0pt;font-family:Verdana'>&nbsp;<SELECT NAME="job" SIZE="9">
<OPTION VALUE="Kouzeln&iacute;k">Kouzeln&iacute;k
<OPTION VALUE="Nekromant">Nekromant
<OPTION VALUE="Lovec">Lovec
<OPTION VALUE="Vrah">Vrah
<OPTION VALUE="Barbar">Barbar
<OPTION VALUE="Paladin">Paladin
<OPTION VALUE="Up&iacute;r">Up&iacute;r
<OPTION VALUE="Vlkodlak">Vlkodlak
<OPTION VALUE="Děln&iacute;k">Děln&iacute;k
</SELECT>
  </span></b></p>
  </td>
  <td width="50%" style='width:50.4%;padding:0cm 0cm 0cm 0cm'>
  <p class=MsoNormal><o:p>&nbsp;</o:p></p>
  </td>
  <td width="0%" style='width:.4%;border:none;padding:0cm 0cm 0cm 0cm'>
  <p class=MsoNormal><span style='font-size:10.0pt'><o:p>&nbsp;</o:p></span></p>
  </td>
 </tr>
 <tr style='mso-yfti-irow:7;mso-yfti-lastrow:yes'>
  <td width="99%" colspan=3 style='width:99.6%;background:#FFFFCC;padding:0cm 0cm 0cm 0cm'>
  <p class=MsoNormal align=center style='text-align:center'><b><span
  style='font-size:10.0pt;font-family:Verdana'><INPUT TYPE="submit" ACTION="phpSecurePages/process.php" METHOD="POST" NAME="Submit">&nbsp;
  <INPUT TYPE="reset" NAME="Reset"></span></b></p>
  </td>
  <td width="0%" style='width:.4%;border:none;padding:0cm 0cm 0cm 0cm'>
  <p class=MsoNormal><span style='font-size:10.0pt'><o:p>&nbsp;</o:p></span></p>
  </td>
 </tr>
</table>

</div>

</form>

</div>

</body>

</html>
panther
Profil
#7 · Zasláno: 5. 8. 2008, 06:51:15
Odpovědět Citovat
merlinok
nevím proč ale tenhle kód co mi vyhodil word je trochu divnej...
a co jsi čekal? Že ti z Wordu vyleze krásný čistý, validní, sémantický a použitelný kód?

Chlapče, Word není HTML editor, na tvorbu stránek se nepoužívá.
pmg
Profil
#8 · Zasláno: 5. 8. 2008, 09:55:49
Odpovědět Citovat
U té původní tabulky byly procentuálně nastaveny rozměry buněk (celkem 100 %). Chtělo by to u těch ostatních řádků zvětšit colspan a rozměry upravit podle potřeb. Nepouštěl jsem se do toho, protože jsem nevěděl, jak přesně to chceš zobrazit.

Jestli to v tom Wordu funguje, zkus z něj třeba extrahovat jen tu tabulku...
merlinok
Profil
#9 · Zasláno: 6. 8. 2008, 01:24:46
Odpovědět Citovat
nějak se mi to z toho extrahovat nepovedlo, ale funguje to tak jak má a sem stím spokojen.
Časová prodleva: 16 let

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0