Fórum Root.cz
Hlavní témata => Vývoj => Téma založeno: eMeNee 23. 03. 2021, 12:49:10
-
Dobrý den,
potřeboval bych do lokálních www stránek (bez nutnosti je ukládat na server) vložit JavaScript, kterými po zadání hodnoty do formuláře vypíše funkcí alert() řádek odpovídající zadané hodnotě v textovém souboru data.txt, který je uložený lokálně v adresáři DATA. Mohl by mi s tím někdo poradit?
zdrojový kód www stránky:
<?xml version="1.0" encoding="utf-8"?>
<head>
<title>Výběr velikosti</title>
<script type="text/javascript">
function velikost(f) {
velikost se rovná vybranému řádku (f.volba.value) v textovém souboru data.txt v adresáři DATA
alert (velikost);
}
</script>
</head>
<html>
<body>
<form>
<H1>Vyber velikost (1,2,3)</H1>
<input type="text" name="volba" onChange="velikost(form);"/>
</form>
</body>
</html>
obsah texťáku DATA/data.txt:
malý
velký
největší
Potřebuju doplnit funkci velikost(f) tak, aby po zadání např. 2 do formuláře se funkcí alert() vypsal 2.řádek souboru tj. velký
Děkuji moc
Změnit zprávu
-
podle me tohle bez vyberu souboru uzivatelem pomoci upload file formulare nejde.
-
Je to záměrně uděláno tak, aby to nešlo.
Alternativou by mohlo být ukládání do cookies nebo do localStorage:
https://www.w3schools.com/js/js_cookies.asp (https://www.w3schools.com/js/js_cookies.asp)
https://www.w3schools.com/jsref/prop_win_localstorage.asp (https://www.w3schools.com/jsref/prop_win_localstorage.asp)
https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Client-side_storage (https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Client-side_storage)
-
podle me tohle bez vyberu souboru uzivatelem pomoci upload file formulare nejde.
A pokud chci použít ten výběr souboru uživatelem tak by se to mělo udělat jak?
Mám přidat do formuláře:
<input type="file" id="files" name="files[]" multiple />
<output id="list"></output>
A nebo jsem na špatné cestě?
-
podle me tohle bez vyberu souboru uzivatelem pomoci upload file formulare nejde.
A nebo to mám chápat, že bez toho, aniž bych to dal na server tuto úlohu nevyřeším?
-
Bez toho uploadu na server to nedas. Nie je to mozne.
Mas moznost ten subor ulozit na server a nasledne spracovat v tom pripade chod cestov
<input type="file" id="files" name="files[]" multiple />
<output id="list"></output>
ale ak nevies ako ho nahrat a spracovat tak doporucujem podobne ako KIT ale skorej
https://developer.mozilla.org/en-US/docs/Web/API/File/Using_files_from_web_applications
https://web.dev/read-files/#toc-reading-files
-
https://www.w3schools.com/jsref/prop_win_localstorage.asp (https://www.w3schools.com/jsref/prop_win_localstorage.asp)
Pokud bych se vydal cestou localstorage, tak ty data jsou fyzicky uloženy kde?
Je možné je v texťáku editovat?
-
Ved to tam mas napisane. Otvoril a precital si si ten link?
Definition and Usage
The localStorage and sessionStorage properties allow to save key/value pairs in a web browser.
The localStorage object stores data with no expiration date. The data will not be deleted when the browser is closed, and will be available the next day, week, or year.
The localStorage property is read-only.
Tip: Also look at the sessionStorage property which stores data for one session (data is lost when the browser tab is closed).
-
Ved to tam mas napisane. Otvoril a precital si si ten link?
Definition and Usage
The localStorage and sessionStorage properties allow to save key/value pairs in a web browser.
The localStorage object stores data with no expiration date. The data will not be deleted when the browser is closed, and will be available the next day, week, or year.
The localStorage property is read-only.
Tip: Also look at the sessionStorage property which stores data for one session (data is lost when the browser tab is closed).
Pardón, angličtinu moc neovládám.
-
Preco mam pocit ze chces rovno hotove riesenie?
Ukaz kus kodu co si uz napisal resp. na com si za zasekol a budem rad ak budem vediet pomoct. Ak mas len to co si napisal hore tak vela stastia a doporucujem si nastudovat jakpsatweb pripadne nieaky ten tutorial.
-
Preco mam pocit ze chces rovno hotove riesenie?
Ukaz kus kodu co si uz napisal resp. na com si za zasekol a budem rad ak budem vediet pomoct. Ak mas len to co si napisal hore tak vela stastia a doporucujem si nastudovat jakpsatweb pripadne nieaky ten tutorial.
Potřeboval jsem nakopnout.
Jen pro ujasnění jestli jsem tu localstorage pochopil správně:
1) každá stránka má svou localstorage
2) každý prohlížeč má svou localstorage
3) data jsou přítomné do té doby než se smažou
(localStorage.removeItem("nazev-polozky"); - jedna položka
localStorage.clear(); - celá paměť)
4) pokud dojde k aktualizaci prohlížeče, systému zůstanou data v localStorage nepoškozená?
-
Bez toho uploadu na server to nedas. Nie je to mozne.
Mas moznost ten subor ulozit na server a nasledne spracovat v tom pripade chod cestov
Soubor vybraný uživatelem lze zpracovat i v JavaScriptu, není nutné jej odesílat na server. Nicméně nedoporučoval bych HTML soubor otvírat z disku – je tam spousta omezení. Pokud to chcete lokálně, je spousta jednoduchých webových serverů, přes které bych to spustil, aby to běželo alespoň na http://localhost:8080 (nebo jiném portu).
-
Pokud to chcete lokálně, je spousta jednoduchých webových serverů, přes které bych to spustil
Nějaké doporučení na konkrétní, případně odkaz, kde bych se o takových serverech něco dozvěděl (nejlépe v češtině).
-
vies co skus google.cz a napisat tam co chces. Sam zbadas ci vlastne rozumies tomu co chces.
-
Nějaké doporučení na konkrétní, případně odkaz, kde bych se o takových serverech něco dozvěděl (nejlépe v češtině).
V češtině mne nic nenapadá… Hodně serverů je pod node.js, např. Web Dev Server (https://modern-web.dev/docs/dev-server/overview/), Mozilla MDN má popsané spuštění serveru v Pythonu: How do you set up a local testing server? (https://developer.mozilla.org/en-US/docs/Learn/Common_questions/set_up_a_local_testing_server). Caddy (https://caddyserver.com) je profi server, ale když ho v nějakém adresáři spustíte příkazem caddy file-server, spustí nad tím adresářem web server (https://caddyserver.com/docs/quick-starts/static-files).
-
A pokud bych chtěl naopak některé hodnoty proměnných z lokální www stránky uložit do texťáku v lokálním adresáři, tak by to šlo a nebo taky ne?
-
Obecně by jakákoliv manipulace s daty na disku neměla být pomocí JavaScriptu možná, pač to by byl ráj pro záškodníky.
Pokud to jde, tak určitě ne normálním způsobem.
-
A pokud bych chtěl naopak některé hodnoty proměnných z lokální www stránky uložit do texťáku v lokálním adresáři, tak by to šlo a nebo taky ne?
Jedině přes download souboru nebo přes FileSystemAPI (https://developer.mozilla.org/en-US/docs/Web/API/FileSystem) (které ale ještě nemá v prohlížečích plnou podporu).
Bylo by jednodušší, kdybyste napsal, co řešíte za problém, než takhle náhodně střílet různé technologie a zkoušet, zda něco trefíte.
-
podle me tohle bez vyberu souboru uzivatelem pomoci upload file formulare nejde.
A pokud chci použít ten výběr souboru uživatelem tak by se to mělo udělat jak?
Mám přidat do formuláře:
<input type="file" id="files" name="files[]" multiple />
<output id="list"></output>
A nebo jsem na špatné cestě?
Tohle by mělo dělat to co chceš = vypíše ti druhý řádek textového souboru, který mu z disku vybereš:
<html>
<input id="f" type="file">
<script>
document.getElementById("f").addEventListener("change", function(event) {
var reader = new FileReader();
reader.onload = function(event) {
alert((event.target.result.split("\n"))[1]);
};
reader.readAsText(this.files[0]);
});
</script>
</html>(možná trochu minimalistické, ale v Chorme, FF i Edge to bez problémů funguje)
-
nic
-
ještě drobná úprava - přidání výběru řádku k zobrazení.
<html>
line <input id="r" type="text" value="1"><br>
<input id="f" type="file">
<script>
document.getElementById("f").addEventListener("change", function(event) {
var reader = new FileReader();
reader.onload = function(event) {
alert((event.target.result.split("\n"))[(document.getElementById("r").value - 1)]);
};
reader.readAsText(this.files[0]);
});
</script>
</html>
-
podle me tohle bez vyberu souboru uzivatelem pomoci upload file formulare nejde.
A nebo to mám chápat, že bez toho, aniž bych to dal na server tuto úlohu nevyřeším?
soubor z file input muzete cist v browseru, prectete si dokumentaci k FileReader API
-
Bez toho uploadu na server to nedas. Nie je to mozne.
na server nemusi nic posilat, ale uzivatel musi vybrat soubor
-
Díky moc všem za rady, toto mi zatím stačí. Chvíli mi zabere, než se tím prokoušu a aplikuju. Jsem pouhý hobby „programátor“, vše dělám ve svém volném čase, angličtina není má silná stránka a google translátor není vždy ideální způsob překladu. Nic méně vím, kterým směrem se můžu vydat.
Řeším úpravu různých textových výstupů, které obsahují různé hodnoty, které je potřeba z daného texťáku vypreparovat, následně z nich matematickými postupy vypočíst hodnoty jiné a ty poté nějakým způsobem dát do textového výstupu.
Potřebuji tento postup aplikovat i v práci, takže jsem omezen nainstalovanými programy a nemožnosti připojit se v práci k internetu. Proto jsem takovéto věci řešil skripty přes příkazový řádek CMD (případně ryze domácí věci v Linuxu v Bashi). CMD řádek je sice silný nástroj, ale ne vše v něm jde jednoduše provézt. Navíc iterace s uživatelem je horší – pouze formou textových zadávání. Proto jsem se začal orientovat na www stránky, v kterých jsem schopný formou formulářů vytvořit poměrně přehledné uživatelské rozhraní a pomocí javascriptu provádět výpočty hodnot. Ale nevěděl jsem, jak mám aplikovat načtení těch vstupních dat a následně vypočtené data z www stránky vyexportovat.
Myslím si, že mnohé rady mi velice pomůžou.
Ještě jednou děkuji
-
Soubor vybraný uživatelem lze zpracovat i v JavaScriptu, není nutné jej odesílat na server. Nicméně nedoporučoval bych HTML soubor otvírat z disku – je tam spousta omezení. Pokud to chcete lokálně, je spousta jednoduchých webových serverů, přes které bych to spustil, aby to běželo alespoň na http://localhost:8080 (nebo jiném portu).
Myslím že by to šlo aj bez web serveru pri lokálnom použití napr. pri použití chrome s prepínačom "--allow-file-access-from-files" - napriklad chrome --allow-file-access-from-files file:///c:/test/test.html
-
JavaScript není dobrý nástroj na úpravu textových souborů. Použij Python. Jeho výhodou je, že je přiložen k řadě programů, třeba Gimpu nebo LibreOffice, takže ho najdeš běžně i v restriktivním firemním prostředí, kde ti nedovolí jen tak si něco nainstalovat.