[js] Klikurl dynamisch maken

[BKJ]

Ik heb het volgende probleem:

Mensen die hebben een invoerveld voor zich waarin ze een naam moeten invullen (zeg: piet). Vervolgens moeten ze op een link klikken die verwijst naar een URL. In deze URL wil ik graag direct de naam Piet in verwerkt hebben.

Dus stel:

invoerveld -> vul in piet

Klik op link met als doel: register.cgi?naam=piet

Is dit met JS op te lossen?

[CrashOne]

Kan gewoon met html:

<form action="register.cgi" method="get">
<input type="text" name="naam" />
<input type="submit" value="versturen" />
</form>

[ Voor 35% gewijzigd door CrashOne op 21-08-2004 20:44 ]

[Johnny]

code:

<input type="text" onkeyup="document.getElementById('link').href='http://mijnwebsite/register.cgi?naam='+this.value;">
<a id="link" href="">ga!</a>

[Verwijderd]

Johnny schreef op 21 augustus 2004 @ 20:48:

code:

<input type="text" onkeyup="document.getElementById('link').href=...
<a id="link" href="">ga!</a>

Ik zou het andersom aanpakken. Als men op de link klikt dan submit je het formulier. Veel simpeler en veel gebruikelijker.

[ Voor 20% gewijzigd door Verwijderd op 21-08-2004 20:49 ]

[BKJ]

code:

<input type="text" onkeyup="document.getElementById('link').onClick='mbetaal(\'id=1234&parameter[1]='+this.value'\');return false;';">
<a id="link" href="#" onClick="">Link</a>

Deze werkt niet

Er moet dit uitkomen:

code:

<a id="link2" href="#" onClick="mbetaal('id=1234&parameter[1]=$waarde');return false;">Betaal-link2</a>

Waarbij $waarde de waarde ingevuld is....

[ Voor 48% gewijzigd door BKJ op 21-08-2004 21:05 ]

[crisp]

je bent ook wel hopeloos moeilijk aan het doen... gebruik gewoon een formulier.

[CrashOne]

Dat dacht ik dus ook, maar ja, als je perse een link wilt is het mogelijk met javascript.

[crisp]

met een link kan je gewoon het formulier laten submitten, wat Cheatah ook al aangaf.

[ Voor 22% gewijzigd door crisp op 21-08-2004 21:10 ]

[BKJ]

crisp schreef op 21 augustus 2004 @ 21:05:
je bent ook wel hopeloos moeilijk aan het doen... gebruik gewoon een formulier.

Maar die info ingevuld in het textfieldje moet gelijk beschikbaar zijn in een popup die wordt aangeroepen met parameters zoals je ziet....

[Verwijderd]

hitchhacker schreef op 21 augustus 2004 @ 21:22:

Maar die info ingevuld in het textfieldje moet gelijk beschikbaar zijn in een popup die wordt aangeroepen met parameters zoals je ziet....

Weet je überhaupt iets over het versturen van formulieren, of niet? Je reactie is namelijk nogal dom, aangezien een formulier met de GET method precies doet wat je wilt. Het enige verschil is dat je normaal gesproken een submit knop hebt in plaats van een link. Maar je hebt genoeg hints gekregen vind ik.

[BKJ]

Verwijderd schreef op 21 augustus 2004 @ 21:39:
[...]

Weet je überhaupt iets over het versturen van formulieren, of niet? Je reactie is namelijk nogal dom, aangezien een formulier met de GET method precies doet wat je wilt. Het enige verschil is dat je normaal gesproken een submit knop hebt in plaats van een link. Maar je hebt genoeg hints gekregen vind ik.

Goed, dat is dus niet echt aardig wel? Misschien als je even beter leest begrijp je wat ik wil. Nog een keer dan..

Bezoekers klikken op deze link:

code:

<a id="link2" href="#" onClick="mbetaal('id=12345&parameter[1]=$waarde');return false;">Betaal-link2</a>

De $waarde wordt ingevuld door de bezoeker. Nu kan ik eerst een formpje maken en op basis daarvan een NIEUWE pagina genereren die die $waarde bevat maar dat leek me omslachtig.

Dus ik vroeg: Kan het ook zo dat een JS'je die taak op zich neemt? Dus dat er idd met een onKeyUP de link waarop ze gaan klikken dynamisch wordt.

Iemand nu dan een idee?

[crisp]

Waarom zou je bij elke key-actie iets gaan aanpassen; het is pas van belang dat de juiste link wordt samengesteld op het moment dat er op de link wordt geklikt, en als je een formulier gebruikt wordt dat automagisch voor je gedaan:

HTML:

<form action="somepage.php" method="get" id="myForm">
  <input type="hidden" name="id" value="12345" />
  <input type="text" name="parameter" />
  <a href="#" onclick="document.forms['myForm'].submit();return false">betaal-link</a>
</form>

en klaar is hitchhacker

[BKJ]

crisp schreef op 22 augustus 2004 @ 13:24:
Waarom zou je bij elke key-actie iets gaan aanpassen; het is pas van belang dat de juiste link wordt samengesteld op het moment dat er op de link wordt geklikt, en als je een formulier gebruikt wordt dat automagisch voor je gedaan:

HTML:

<form action="somepage.php" method="get" id="myForm">
  <input type="hidden" name="id" value="12345" />
  <input type="text" name="parameter" />
  <a href="#" onclick="document.forms['myForm'].submit();return false">betaal-link</a>
</form>

en klaar is hitchhacker

Hmm...bedankt voor de moeite maar dit is het ook helaas niet.

Kijk: Die link opent een popup met een aantal parameters (via een ander JS'je) en die parameters wil ik graag af laten hangen van het formfieldje.

Jouw oplossing is gewoon een plain submit.

Oftewel: de link moet dynamisch worden.....

[crisp]

Je kan dan in die functie mbetaal() toch gewoon de waarde van het textveld uitvragen, en die toevoegen aan de link die je opent? Lijkt het maar zo, of weet je echt helemaal niets van javascript, want ook dat is wel heel erg basic:

HTML:

<input type="text" id="naam" />
<a href="#" onclick="mbetaal();return false">betaal-link</a>

JavaScript:

function mbetaal() {
  var naam = document.getElementById('naam').value;
  window.open('register.cgi?naam='+escape(naam));
}

maar goed, hiermee doe je dus niets anders dan de standaard form-functionaliteit nabouwen, en een form heeft ook een target attribuut, dus een popup targetten is ook geen enkel probleem.

[ Voor 18% gewijzigd door crisp op 22-08-2004 14:33 ]

[Johnny]

crisp schreef op 22 augustus 2004 @ 13:24:
Waarom zou je bij elke key-actie iets gaan aanpassen; het is pas van belang dat de juiste link wordt samengesteld op het moment dat er op de link wordt geklikt, en als je een formulier gebruikt wordt dat automagisch voor je gedaan:

HTML:

<form action="somepage.php" method="get" id="myForm">
  <input type="hidden" name="id" value="12345" />
  <input type="text" name="parameter" />
  <a href="#" onclick="document.forms['myForm'].submit();return false">betaal-link</a>
</form>

en klaar is hitchhacker

Een onkeyup is inderdaad een beetje een overkill, en het werkt niet als je met de muis gaat plakken, maar onclick is volgens mij niet genoeg wanneer je met het toetsenbord gaat navigeren.

Het beste lijkt me om op de input een onblur te doen, of een onfocus op de link.