derekjohnson/registration.html

## registration.html
<!doctype html>
<html class="no-js" lang="en">
    <head>
        <meta charset="utf-8">
        <title>DEMO - Form with two submit buttons using HTML5</title>
        <meta name="viewport" content="width=device-width">
    </head>

    <body>
    	<h1>Registration</h1>

    	<form action="register.php" method="post" id="register">
            <label for="username">Username</label>
            <input id="username" type="text" pattern="[A-Za-z]+[0-9]{0,2}" placeholder="No twitter spamhandles" required>

            <label for="password">Password</label>
            <input id="password" type="password" required>

            <span id="membership-type">
                <label for="free">Free</label>
                <input id="free" type="radio" name="membership" value="free">

                <label for="paid">Paid</label>
                <input id="paid" type="radio" name="membership" value="paid">
            </span>

            <input id="submit" type="submit" value="Join">
        </form>

        <script>
            var supportsFormaction = function() {
                var input = document.createElement("input"); // create an element in memory
                return "formAction" in input; // check if the browser supports the attribute
            }

            if(supportsFormaction()) {
                var premium = document.createElement("input"),
                    free = document.getElementById("submit"),
                    registration_form = document.getElementById("register");

                // set up the premium submit button
                premium.setAttribute("formaction","premium.php");
                premium.type = "submit";
                premium.value = "Join Premium";

                registration_form.appendChild(premium); // add the new button to the form

                // change the original submit button into a free submit button
                free.setAttribute("formaction","free.php");
                free.value = "Join Free";

                // hide the radio buttons
                document.getElementById("membership-type").style.display = "none";
            }
        </script>
    </body>
</html>
	<!doctype html>
	<html class="no-js" lang="en">
	<head>
	<meta charset="utf-8">
	<title>DEMO - Form with two submit buttons using HTML5</title>
	<meta name="viewport" content="width=device-width">
	</head>

	<body>
	<h1>Registration</h1>

	<form action="register.php" method="post" id="register">
	<label for="username">Username</label>
	<input id="username" type="text" pattern="[A-Za-z]+[0-9]{0,2}" placeholder="No twitter spamhandles" required>

	<label for="password">Password</label>
	<input id="password" type="password" required>

	<span id="membership-type">
	<label for="free">Free</label>
	<input id="free" type="radio" name="membership" value="free">

	<label for="paid">Paid</label>
	<input id="paid" type="radio" name="membership" value="paid">
	</span>

	<input id="submit" type="submit" value="Join">
	</form>

	<script>
	var supportsFormaction = function() {
	var input = document.createElement("input"); // create an element in memory
	return "formAction" in input; // check if the browser supports the attribute
	}

	if(supportsFormaction()) {
	var premium = document.createElement("input"),
	free = document.getElementById("submit"),
	registration_form = document.getElementById("register");

	// set up the premium submit button
	premium.setAttribute("formaction","premium.php");
	premium.type = "submit";
	premium.value = "Join Premium";

	registration_form.appendChild(premium); // add the new button to the form

	// change the original submit button into a free submit button
	free.setAttribute("formaction","free.php");
	free.value = "Join Free";

	// hide the radio buttons
	document.getElementById("membership-type").style.display = "none";
	}
	</script>
	</body>
	</html>