Input werte via document.getElementById an URL übergeben

[farbodp]

Moin,

so langem basteln habe ich nun fast das was ich haben möchte. Auf der Wordpressseite gibt es ein Buchungsformular. Nach dem nun auf prüfen geklickt wird öffnet sich eine Thickbox, hier geht aber irgendwas schief. der lädt in der thickbox einfach die bestehende Seite anstatt der URL und zusätzlich soll die URL mit den Inputwerte die übergeben werden ergänzt werden.

Mein Code bisher:

<input type="submit" class="thickbox btn btn-large btn-darkbrown" value="Prüfen" onclick="tb_show('https://ibe.dirs21.de/Channels/bayers-hotel/default.aspx?anreise='+document.getElementById('anreise').value+'&abreise='+document.getElementById('abreise').value+'&adults='+document.getElementById('adults').value+'&children=1'+document.getElementById('children').value+'&TB_iframe=true&height=800&width=800&modal=true')">

URL: Hotel Bayer's | Hotel Bayer's, Ihr Cityhotel im Herzen Münchens

Danke für eure Hilfe

EDIT:
Ich habs nun soweit geschafft dass die Thickbox aufgeht. Hierzu habe ich den Code etwas angepasst und musste die Variablen im URL weglassen. Nun wäre die Frage wie binde ich die Werte aus den Inputfelder in die URL ein damit sie übergeben werden?

<input type="button" class="btn btn-large btn-darkbrown" value="Prüfen" onclick="tb_show('Zimmer','https://ibe.dirs21.de/Channels/bayers-hotel/default.aspxTB_iframe=true&height=800&width=800')">

 

[Dormilich]

Nun wäre die Frage wie binde ich die Werte aus den Inputfelder in die URL ein damit sie übergeben werden?

benutze GET als submit-Methode des Formulars.

 

[farbodp]

Die Antwort ist nicht grad sehr hilfreich. GET ist mir klar, nur darf die Seite nicht neugeladen werden, da der Inhalt in die Thickbox geöffnet wird... Ich hab nur gelesen dass man so etwas via Ajax realisieren kann, damit die Seite nicht neugeladen wird. Bringt mich aber auch nicht wirklich weiter, da die Thickbox auf den Submit button nicht reagiert...

 

[Dormilich]

das mit dem nicht Neuladen war so nicht ersichtlich. Macht aber nichts, da du Formularinfo auch sammeln kannst, ohne das Formular abzuschicken. (jQuery hat da z.B. serialize())

 

[farbodp]

Super, danke!

Jetzt bleibt die Frage wenn ich einen Script erstelle ala:

<script>
$(document).ready(function(){
    $("button").click(function(){
        $("div").text($("form").serialize());
    });
});
</script>

wird der output in einem div-container ausgegeben... wie sorge ich dafür damit das ganze am richtigen platz landet?

<input type="button" class="btn btn-large btn-darkbrown" value="Prüfen" onclick="tb_show('Zimmer','https://ibe.dirs21.de/Channels/bayers-hotel/default.aspx?[B][COLOR="#FF0000"]HIERMÜSSTEDEROUTPUTHIN[/COLOR][/B]TB_iframe=true&height=800&width=800')">

 

[Dormilich]

indem man z.B. event handler nicht im HTML definiert.

die Frage ist, ob die funktion tb_show() auch gleich ausgeführt werden soll (dann mach das aus dem click handler heraus). ansonsten kannst du solche daten in den data-* Attributen zwischenspeichern, und der andere handler holt sich diese dann über die button Referenz (this).