Tutorials
[ Zurück ]


Javascript - Aus Formulardaten Link generieren


Hallo,

ich habe schon lange nach einer Möglichkeit gesucht, aus Formulardaten einen Link zu generieren. Hintergrund ist der, dass meine Wetterstationssoftware für jeden Tag eine HTML-Datei ausspuckt, in welcher die Tageswerte stehen. Die Name der Datei setzt sich aus Tag, Monat und Jahr zusammen. Der 25.02.2014 wäre also die Datei 20140225.htm. Also habe ich ein Script gesucht, wo man nur das gewünschte Datum eingeben, bzw. auswählen muss und nach dem Anklicken eines Buttons/Links sich die entsprechende Wetterdatendatei öffnet.

Üblicher Weise werden die Formulardaten ja per "get" oder "post" übergeben. In der URL Zeile des Browsers erscheint als Dateianhängsel noch ein ?=bla1=12&bla2=13&bla3=13 oder so ähnlich. Und genau dies wollte ich eben nicht. Es gibt kaum Scripts wo aus den Formulardaten an Stelle des Dateianhängsels ein Link generiert wird. Allerdings gebe ich ja so leicht nicht auf.

Gestern habe ich dann lang und ausgiebig gesucht und... wurde fündig. In diesem Forum entwickler-forum.de/archive/index.php/t-68747.html Beitrag
clemensp - 01.09.2011, 15:24 fand ich endlich genau das, was ich gesucht habe. Den Code in eine Textdatei kopiert und die Textdatei in Test.htm umbenannt und siehe da, es funktionierte. Nachfolgend war es ein Leichtes es an meine Bedürfnisse anzupassen und mittels CSS noch etwas schicker zu machen.

Hier nun der funktionsfähige Code. Einfach in eine leere, mit Texteditor geöffnete HML-Datei einfügen und an die eigenen Wünsche anpassen.
<html>
<head>
<title>Daten - Auswahl</title>
</head>
<body>

<script language="JavaScript" type="text/javascript">
var ObjTag=document.getElementById;
function generateLink()
{
var ObjIn= ObjTag("selectLink").value;
ObjIn= ObjIn.replace("http://","");
ObjTag("include").innerHTML='<a href="http://' + ObjIn + '">' + ObjIn + '</a>';

}

</script>
<center><b><br><br><br>
Bitte wählen Sie ein Datum.<br>
Es werden danach die Daten des<br>
von Ihnen angegebenen Datums geöffnet.<br><br>
Tag | Monat | Jahr

<form name="URLForm">

<p><select size="1" name="Tag">
    <option selected>01</option>
    <option>02</option>
    <option>03</option>
    <option>04</option>
    <option>05</option>
    <option>06</option>
    <option>07</option>
    <option>08</option>
    <option>09</option>
    <option>10</option>
    <option>11</option>
    <option>12</option>
    <option>13</option>
    <option>14</option>
    <option>15</option>
    <option>16</option>
    <option>17</option>
    <option>18</option>
    <option>19</option>
    <option>20</option>
    <option>21</option>
    <option>22</option>
    <option>23</option>
    <option>24</option>
    <option>25</option>
    <option>26</option>
    <option>27</option>
    <option>28</option>
    <option>29</option>
    <option>30</option>
    <option>31</option>
    </select>

    <select size="1" name="Monat">
    <option>01</option>
    <option>02</option>
    <option>03</option>
    <option>04</option>
    <option>05</option>
    <option>06</option>
    <option>07</option>
    <option>08</option>
    <option>09</option>
    <option>10</option>
    <option>11</option>
    <option>12</option>
    </select>

    <select size="1" name="Jahr">
    <option>2004</option>
    <option>2005</option>
    <option>2006</option>
    <option>2007</option>
    <option>2008</option>
    <option>2009</option>
    <option>2010</option>
    <option>2011</option>
    <option>2012</option>
    <option>2013</option>
    <option>2014</option>
    </select>


</form><br/>
<a href="http://www.start.de/suche/" name="ZielLink"
 onclick="window.document.links['ZielLink'].href = 'http://www.deineHP.de/' 
 + window.document.forms['URLForm'].elements['Jahr'].value 
 + window.document.forms['URLForm'].elements['Monat'].value
 + window.document.forms['URLForm'].elements['Tag'].value +'.htm';" 
 target="_blank" >Anzeigen</a></center></b>
</body>
</html>

Erstellt:08.03.14 19:53
Autor: enager

Letzte Änderung: 08.03.14 19:59
Geändert von: enager

Bewertungen:0
Bewertung:

Freigeschaltet: Ja
Views 1922

Klicke einfach auf einen Stern!
Wollen Sie wirklich das Tutorial löschen?
Wollen Sie wirklich dieses Tutorial zulassen?
Betreff: Report tutorial [id = 789] !
Absender:
Kommentar:
Wollen Sie wirklich dieses Tutorial zulassen?
Absender:
Kommentar:
Folgende User sind hier gerade aktiv:
-

ANZEIGE