Jonas Sobottka Jonas Sobottka - 1 year ago 65
Javascript Question

Open a Link with a variable that was provided by a HTML Form

I want to Create a Form, that when its Submitted opens a link with a Variable which is the Input from the Textfield of the Form.

Here is an example:

<form onsubmit=<a href="$UserInput target"_blank">
<p><input type="text" name="name" value="UserInput"/></p>
<p><input type="submit" value="Verbinden" /></p>

I do not need a Solution to get this exact example to work.
All I want is:

The User Puts Something in The Form and presses the Submit Button.
With Pressing the Submit Button the Browser opens The Link i provide with the Input as a Part of the Link.

In real life it means i want to use a Teamspeak Join Link with the username which the user has provided in the Form.

This is the Link that has to be Modified at the end with the username

ts3server://serverip?port=11&password=123&nickname=!Input from the Form!

I hope there is a better Way than the way i use at the moment:

form.html =

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
<html xmlns="" xml:lang="en-US" lang="en-US">
<table border="0" cellspacing="0" cellpadding="0" width="200" id="LayoutBereich5" style="background-attachment: fixed; border: 1px solid rgb(179,0,180); margin: 1px; height: 50px;" >
<tr align="center" valign="top">

<form action="startts3.php" method="post">
<p>Namen bitte anpassen:
<p><input type="text" name="name" value="InGameName|RealName"/></p>
<p><input type="submit" value="Verbinden" /></p>


startts3.php =

$name = $_POST["name"];
header("Location: ts3server://serverip?port=11password=123&nickname=$name");

Answer Source

You can try this:

<script src=""></script>
  <p><input type="text" name="name" value="UserInput"/></p>
  <p><input type="submit" value="Verbinden" /></p>
  $("form").submit(function(event) {
    window.location.href = "ts3server://serverip?port=11&password=123&nickname=" + $("input[name=name]").val();

It doesn't actually submit the form: JavaScript takes over and opens it by itself.

EDIT As per request, I've included the JS alongside the HTML to show how it can be used.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download