user2353818
user2353818

Reputation:

HTML, making a button submit data to another url?

The following is my HTML:

<form class="form-horizontal" method="post">
        <div class="control-group">
            <label class="control-label" for="inputEmail">Email</label>
            <div class="controls">
                <input type="text" id="inputEmail" placeholder="Email">
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="inputPassword">Password</label>
            <div class="controls">
                <input type="password" id="inputPassword" placeholder="Password">
            </div>
        </div>
        <div class="control-group">
            <div class="controls">
                <label class="checkbox">
                    <input type="checkbox"> Remember me
                </label>
                <button type="submit" class="btn btn-success">Sign in</button>
                <button class="btn btn-primary"> Make a new account </button>
            </div>
        </div>
    </form>

Note: Just in case someone is wondering, it is utilizing the bootstrap library.

I have the form and it POSTs to login.php but I want the button Make a new account post the same data to register.php.

Is that possible? If so, how?

Upvotes: 16

Views: 42065

Answers (5)

user33192
user33192

Reputation: 1182

Just add another submit button with formaction attribute.

 <form action="/submit">

      <input type="submit" value="Submit">
      
      <input type="submit" value="Go Elsewhere" formaction="/elsewhere">
      
 </form>

For more details, you can visit this url.

Upvotes: 1

C3roe
C3roe

Reputation: 96250

I have the form and it POSTs to login.php but I want the button Make a new account post the same data to register.php.

Is that possible?

In HTML5 it is, using the formaction attribute on the submit button.

But browser support is probably not so good yet. Could be resolved using a Polyfil that attaches click handlers to such buttons automatically and changes the action attribute of the form dynamically, though.

Upvotes: 9

Vivek Jain
Vivek Jain

Reputation: 3889

Try the following:

In HTML add an onclick event handler for Make a new account button:

<form class="form-horizontal" method="post" id="myform">
        <div class="control-group">
            <label class="control-label" for="inputEmail">Email</label>
            <div class="controls">
                <input type="text" id="inputEmail" placeholder="Email">
            </div>
        </div>
        <div class="control-group">
            <label class="control-label" for="inputPassword">Password</label>
            <div class="controls">
                <input type="password" id="inputPassword" placeholder="Password">
            </div>
        </div>
        <div class="control-group">
            <div class="controls">
                <label class="checkbox">
                    <input type="checkbox"> Remember me
                </label>
                <button type="submit" class="btn btn-success">Sign in</button>
                <button class="btn btn-primary" onclick="javascript:register()"> Make a new account </button>
            </div>
        </div>
    </form>

In JavaScript:

function register() {
    this.action = 'register.php';
    return true;
}

If this does not work, you may try:

function register() {
    var frm = document.getElementById("myform");
    frm.action = 'register.php';
    return true;
}

One or both of the above mentioned solution should work for you. Prefer the first approach as it is cleaner.

Please take this as a starting point not a copy-paste solution and follow the best practices for development.

Upvotes: 9

Arnaud Denoyelle
Arnaud Denoyelle

Reputation: 31225

<form class="form-horizontal" method="post" action="register.php">

Upvotes: 1

filipko
filipko

Reputation: 965

Set action attribute of your form tag to the URL of the page to send the data to.

Upvotes: 14

Related Questions