Autor Zpráva
HelenaO
Profil
Ahoj!

Snažím se proniknout do tajů JavaScriptu a mám zákys. Mám 2 formulářová pole typu text. Když do nich zadám čísla, pak se mi sečtou, ale do výstrahy (alert okno), co mám ale udělat, aby se mi výsledek vyplnil do třetího formulářového pole? Už několik hodin procházím diskuse a nic :-(

Předem díky za pomoc
peta
Profil
HelenaO
jakpsatweb - javascript - priklady

"Mám 2 formulářová pole"
A protoze nei odkaz na stranku, tak ty je mas, my je nemame a problem je vyresen.
Podrobne problem psani tematu rozebira tema na foru
diskuse.jaksatweb - jak neco udelat - nez zalozite nove tema
yFang
Profil
HelenaO
Zkus ukázat tvůj kód, třeba ti poradíme, co děláš špatně.
HelenaO
Profil
peta
Za porušení protokolu se omlouvám, četla jsem ho i pravidla diskuse, ale neuvědomila jsem si to.

yFang
Díky za druhou šanci, z předchozího příspěvku bych to bohužel nepochopila.

Při opuštění kurzoru z druhého sčítance na mě výsledek vyskočí v alert okně. Stějně tak když se klikne na tlačítko (omlouvám se za expresivní název, ale dost mě to štve, že to nechápu). Studuju seč mi síly stačí, ale nevím co a jak použít, aby se výsledek zobrazil ihned v poli s názvem "vysledek". Druhá věc o kterou se snažím, podobně úspěšně :-(, je, aby se výsledek zobrazil po kliknutí na tlačítko vedle. Taky mi to vyskočí do alertu. Výsledky jsou správné, ale jinde než si představuji.

Jak už jsem psala: začínám, tak mě, prosím, nekamenujte, že nemám skript v externím souboru.

Díky

kód:
<html>
<head>
<title>Sesty pokus</title>
<script type="text/javascript" language="JavaScript"><!--
function pocitani(c,d)
{
alert(c+d);
}
// --></script>
</head>
<body onload="document.getElementById('prvnicislo').focus();">
<form name="formular">
<input id="prvnicislo" type="text" name="zdrojcislo" value="první sčítanec">
<input type="text" name="zdrojcislo2" value="druhý sčítanec" onBlur="pocitani(eval(self.document.forms.formular.zdrojcislo2.value), eval(self.document.forms.formular.zdrojcislo.value));">
<input type="text" name="vysledek">
<input type="button" value="Počítej, ty bestie!" onClick="pocitani(eval(self.document.forms.formular.zdrojcislo2.value) ,eval(self.document.forms.formular.zdrojcislo.value));">
</form>
</body>
</html>
Nox
Profil
S evalama pryč, tam je riziko neplechy, hlavně ze strany jiných uživatelů:
<input type="text" name="cislo1" value="5">
<input type="text" name="cislo2" value="10">
<input type="text" name="vysledek" value="">
<input type="button" value="Spočítej" onclick="document.forms['formular']['vysledek'].value=document.forms['   formular']['cislo1'].value-(-document.forms['formular']['cislo2'].value)">

Pozn.: není tam + protože by to JS vzalo jako sčítání řetězců..šlo by to asi i třeba přes parseInt a tak,
ale toto je takový jednoduchý a efektivní trik
HelenaO
Profil
Jůůůů, ono to funguje!!! Díky Noxi. A šlo by to i bez kliknutí na tlačítko - počítání v reálném čase hned jakmile se zadají hodnoty? Neber to jako nevděk, vím, že si vymýšlím :-) A ještě budu muset nastudovat, cos mi to vlastně poradil (jestli jsou to příkazy, funkce nebo dokonce metody - v tom bohužel značně plavu).
peta
Profil
HelenaO
jakpsatweb - javascript - udalosti
jakpsatweb - javascript - priklady - udalosti / formulare
Nox
Profil
HelenaO
třeba onblur - když odoznačíš prvek nebo onkeyup při napsání znaku (resp. puštění klávesy)
Protože se sčítáním není problém jako s dělením, tak to můžeš aplikovat na oba elementy a ikdyž
bude jeden nevyplněnej, tak by to mělo fungovat v pohodě

A ještě by se asi mělo přidat ověření, aby tam někdo nezadával nečíselný znaky
HelenaO
Profil
peta
Celý víkend jsem nedělala nic jiného (snad kromě čtení knížky Začínáme s JavaScriptem) než prolézala různé diskuse, pročetla jsem spoustu zbytečného textu jenom proto, abych někoho nepobouřila, že už se na stejný dotaz ptal někdo v minulosti. Yuhůův web mám prolezlý skrz na skrz, vím, že to tam je (jenom za neděli jsem tam byla asi 10x), ale nemůžu si pomoct. Prostě tomu nerozumím. Na poli html a css (skoro) všechno co umím, umím od Yuhůa. Ale co se týká JS jeho výklad mi prostě neleze do palice. Uznávám, že je to chyba té palice a nikoliv Yuhůova, ale i tak jsem se domnívala, že v diskusi se můžu zeptat. Mrzí mě, že tím některé členy obtěžuju.

Nox
Díky mockrát. Za odpověď i vstřícnost. Pro začátečníka jsou k nezaplacení ti, kteří se dokážou odpoutat od toho, že některé věci už dávno považují za samozřejmé. Tvoje rady mě posouvají směrem k vyřešení "problémů".

Je v moci JS oddělovat řády čísel? Např. z 1000000 udělat 1 000 000? V diskusi jsem našla, že to jde přes php, ale to bohužel není řešení pro mě.
peta
Profil
HelenaO
Ja v tom nevidim zadny problem.
JS je programovaci jazyk. Je treba k nemu zaujmout zcela jiny postoj nez ke znackam zvyrazneni textu a pod. Je pravda, e tyto znacky vyuziva.
Sazmozrejme ti ten priklad muzu udelat, ale o moc vetsi budes mit radost, kdyz to das dohromady sama. Takze jsem t vypsal, ktere stranky vedou k reseni tveho problemu. At nemusis prochazet cely jakpsatweb.
Tez muzu udelat to, ze ti presne z tech stranek vykopiruji prislusne radky textu a programu. Coz mi prislo jako zbytecne plytvani mistem diskuse.
Tez jsem te mohl zrovna odkazat na vyhledavani googlem, coz delam s kazdym druhym. V tomto pripade to ma nahodou Juhu na webu.

Co se tyce poruseni protokolu, to je tvuj vymysl. Tady si pise kazdy, jak se mu zlibi. Podstatne je, zda je mozne jeho problem pochopit z informaci, ktere poskytne. Rekni sama, co ti na tvuj prvni prispevek mame odpovedet? yFang napsal totez, co ja.

jak uz jsem napsal, cely problem vyresi asi 5 a 5 prikladu na
jakpsatweb - javascript - priklady - formulare
jakpsatweb - javascript - priklady - udalosti

<form name="mujf" onsubmit="funkceX(this)" action="#">
<input type="text" name="cislo1" value="první sčítanec">
<input type="text" name="cislo2" value="druhý sčítanec" onkeydown="funkceX(this.form)">
<input type="text" name="vysledek">
<input type="submit" value="Počítej, ty bestie!">
</form>

<script>
function funkceX(form)
{
form.vysledek.value = form.cislo1.value*1 + form.cislo1.value*1;
}
</script>

To tam v tech prikladech na formulare je, bez onkeydown. A udalosti jsou zas jinde.
totez je na foru, jak to najit? google.com
slova = site:diskuse.jakpsatweb.cz javascript pocitani
slova = site:diskuse.jakpsatweb.cz javascript kalkulacka
nebo na inetu
slova = javascript calculator example

Je mozne, ze ti zatim nikdo nerekl, jak se spravne pouziva vyhledavani. Cemu bych se nedivil. Hlavne, ze se uci mail, word, internet, ale jak pouzivat vyhledavac... Ne, misto toho vas poslou na seznam.cz , coz neni vyhledavac, ikdyz nejakou takovou funkci ma.
HelenaO
Profil
Peta

Díky za Tvůj čas strávený psaním návodu. Věř, prosím, že kdybych to od Yuhůa pochopila, neptala bych se v diskusi. Máš pravdu v tom, že mě opravdu netěší tupě překopírovat kód (což nedělám), takže se pídím po principu, vysvětlení, fungování. Počítat už můj skript umí. yFang opravdu napsal v podstatě totéž, ale od něj jsem pochopila, co jsem udělala za chybu. Z Tvého příspěvku mi bylo akorát jasné, že jsem něco zmastila a mazákovi se to nelíbí.

Nevim, koho myslis tim "...vas poslou na seznam.cz...", jako bys sám chodil na lepší školu, než my všichni ostatní, ale je pravda, že kdybych používala jen to, co nás naučili ve 2 semestrech informatiky, tak se věru o html asi nezajímám.

Měj pěkný den
peta
Profil
HelenaO
"chodil na lepší školu"
skolu zivota. proste jsem se zeptal, jake jsou vyhledavace, zadal do nich, co jsem hledal a ktere mi toho nasli k problemu vic, ty pouzivam. A pak je samozrejme nutne umet si vybrat spravna slova, ktera by mohla byt pro dane tema jedinecna, aby to naslo co nejmene jinych stranek.

Jak tam pises, ze jsi cetla cely vikend knizky, to je pekne, otazka je, jak ucelne. Ano, kdyz mne neco zajima, prectu si i knizku, kdyz ji mam. Jinak obvykle postupuji zpusobem, ze si najdu priklad a snazim se radek po radku dohledat funkci, co asi dela. Treba pres w3school nebo jakpsatweb a pod. Neni tam sice toho moc, ale obcas to staci.

Mno, a proste mi prislo zbytecne se rozkecavat. Tak jsem odpovedi zkratil.

"Počítat už můj skript umí."
Bys mohla ukazat, treba :)
HelenaO
Profil
Peta

Dík za odkaz na w3school, vypadá to tam zajímavě. Což o to, ukázat kód můžu, stejně bych ho bez Noxe neměla, ale nevím, k čemu mazákům může být nějaký usmolený začátečnický skriptík dobrý. Soustředila jsem se na skript, takže jsem nedělala moc čistě styl (přes exter css), ani html by neprošel validátorem. A pořád ještě neumím oddělit tisícové řády od sebe mezerou.

externi-skript.js
function zapissazbu(){
if (document.formular.varianta[0].checked)
document.formular.sazbaevropa.value="37";
else if (document.formular.varianta[1].checked)
document.formular.sazbaevropa.value="40";
else window.alert("nebyla vybrána varianta")}
function zapissazbu2(){
if (document.formular.varianta[0].checked)
document.formular.sazbasvet.value="57";
else if (document.formular.varianta[1].checked)
document.formular.sazbasvet.value="60";
else window.alert("nebyla vybrána varianta")}
function spocitejpojistne(){
document.formular.pojistneevropa.value=(document.formular.sazbaevropa .value)*(document.formular.evropa.value);}
function spocitejpojistne2(){
document.formular.pojistnesvet.value=(document.formular.sazbasvet.val ue)*(document.formular.svet.value);}
function spocitejrocnizalohovepojistne(){
document.formular.pojistne.value=(document.formular.pojistneevropa.value)-(-document.formular.pojistnesvet.value);}

vlastní dokument
<html>
<head>
<title>Devátý pokus</title>
<script type="text/javascript" language="JavaScript" src="externi-skript.js">
</script>

<style type="text/css">
* {font-family: Arial};
input {text-align: right}</style>
</head>
<body onload="document.getElementById('start').focus();">

<form name="formular">
<input type="radio" name="varianta" checked id="start" onClick="zapissazbu(); zapissazbu2(); spocitejpojistne(); spocitejpojistne2(); spocitejrocnizalohovepojistne();">&nbsp;Varianta 1<br>
<input type="radio" name="varianta" onClick="zapissazbu(); zapissazbu2(); spocitejpojistne(); spocitejpojistne2(); spocitejrocnizalohovepojistne();">&nbsp;Varianta 2<br><br>

<table border="0" cellspacing="5"><tbody>
<tr><td colspan="2"><b>Cestovní pojištění</b></td></tr>
<tr><td>Předpokládaný počet procestovaných dní: </td><td><input type="text" name="evropa" value="0" onBlur="zapissazbu(); zapissazbu2(); spocitejpojistne(); spocitejpojistne2(); spocitejrocnizalohovepojistne();"></td></tr>
<tr><td>Předpokládáný počet procestovaných dní: </td><td><input type="text" name="svet" value="0" onBlur="zapissazbu(); zapissazbu2(); spocitejpojistne(); spocitejpojistne2(); spocitejrocnizalohovepojistne();"></td></tr>
<tr><td>Roční zálohové pojistné za cestovní pojištění:</td><td><input type="text" name="pojistne" readonly="readonly" value="0"> Kč</td></tr>
<tr><td colspan="2" align="center"><input type="button" name="Spocitej" value="Přepočítat" style="text-align: center" onClick="zapissazbu(); zapissazbu2(); spocitejpojistne(); spocitejpojistne2(); spocitejrocnizalohovepojistne();"></td></tr></tbody></table>
<br>
<input type="hidden" name="sazbaevropa" value=""><br>
<input type="hidden" name="sazbasvet" value=""><br>
<br>
<input type="hidden" name="pojistneevropa" readonly="readonly"><br>
<input type="hidden" name="pojistnesvet" readonly="readonly"><br>

</form>
</body>
</html>

Nechť cupování započne :-)
Nox
Profil
HelenaO
Málem sem na tenhle topic zapomněl:) tahle diskuse na to není moc stavěná

Minimálně tady v téhle vizuální podobě není skript moc čitelný:) Nebyla by třeba online varianta?

Jinak lepší než <body onload="document.getElementById('start').focus();"> je dát tag skript za input, protože <body onload=""> čeká, až se načte úplně celý dokument, script zapsaný rovnou se provede hned

Taky pokud je onblur u všech stejný (onkeyup by bylo dobrý použít taky), tak by se to dalo dát do jedné funkce (třeba i jen volání těch jednotlivých funkcí, ale asi by to bylo celkem zdlouhavé pro skripty, ikdyž pravda v praxi by se to nepoznalo)

Ale hlavně že už jede
peta
Profil
HelenaO
"k čemu mazákům může být nějaký usmolený začátečnický skriptík dobrý"
kdo rika, ze je to mazakum. Asi mas pravdu, zacatecnici na foru nehledaji, radeji polozi dotaz. :)

function zapissazbu()
{
if (document.formular.varianta[0].checked)
document.formular.sazbaevropa.value="37";
else if (document.formular.varianta[1].checked)
document.formular.sazbaevropa.value="40";
else window.alert("nebyla vybrána varianta")
}

--->

function zapissazbu()
{
var f = document.formular;
if (f.varianta[0].checked)
{f.sazbaevropa.value="37";}
else
{
if (f.varianta[1].checked)
{f.sazbaevropa.value="40";}
else
{alert("nebyla vybrána varianta");}
}
}

Sice JS je proti PHP dost inteligentni, ale pro jistotu bych tam ty zavorky daval.

onBlur="zapissazbu(); zapissazbu2(); spocitejpojistne(); spocitejpojistne2(); spocitejrocnizalohovepojistne();"
onClick="zapissazbu(); zapissazbu2(); spocitejpojistne(); spocitejpojistne2(); spocitejrocnizalohovepojistne();"

--->

function spocitejX()
{zapissazbu(); zapissazbu2(); spocitejpojistne(); spocitejpojistne2(); spocitejrocnizalohovepojistne();}

onBlur="spocitejX()"
onClick="spocitejX()"

focus viz Nox, zkusil bych jeste tabindex nastavit pro dany input. Focus nefunguje tusim v Opere7 a v IE6.
HelenaO
Profil
A co to oddělování tisíců? Zatím od nikoho ani písmenko, buďto to zapadlo nebo to nejde...

Díky za poznámky - opisovat jak pitomec pořád document.formular... mi bylo jasný, že je hloupost, ale nahrazení proměnnou se mi nepodařilo, díky za návod (možná se mi tahle konkrétní operace podařila, ale "na stránce se vyskytla chyba" je hlášení, které člověka nepotěší, a když v tom plave, tak pak jede otrocky v tom, co někde našel a tam to fungovalo).

Odkaz na stránku dát nemohu, neb žádnou nemám. Není to on-line, bohužel. Přišlo mi zbytečný honem si shánět doménu a platit hosting, když jsem studium zahájila teprve 7. května tohoto roku.

Historka je taková: v práci jsem se účastnila na tvorbě webu (nikoliv hlavního firemního, jenom takového jednoduchého produktové). Návrh toho webu jsem dělala v excelu, protože jsem tehdy nic jiného neuměla. Pak se to dalo profíkům (tedy externí specializované firmě), ať spáchaj on-line i off-line verzi. A profíci remcali a frfňali, že to je moc práce a že za vývoj off-line budou chtít zaplatit ještě jednou, protože to je úúúúúúplně, ale úúúúúúplně něco jiného a všechno se musí dělat znovu.

Sama pro sebe jsem si řekla, že to přece nemůže být takový problém a že to je spíše lenost a neochota, než technický problém. Myslím, že ten, kdo má informační převahu a ví o ní, tak toho vůči informačně slabšímu partnerovi může využívat a zneužívat. Takže když profík ví, že zákazník netuší o programování stránek nic, tak se může kroutit jak žížala (nebo překližka ve vodě) a nastřelit fakturu o 50 % navíc. Nikoho konkrétního neobviňuju, jenom to tak na mě působí. A zkouším si dokázat, že to zvládnu taky. Takže, pokud to zvládnu, dám to firmě k dispozici a budu doufat, že to ocení. Trávím na tom spoustu volného času. A když to nezvládnu, tak se nic nestane. Ale štvát mě to bude, to teda jo :-)

Ale aby to nezapadlo: díky oběma za rady!

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

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

0