Passing Form Data to Another HTML Page

passing form data to another HTML page

If you have no option to use server-side programming, such as PHP, you could use the query string, or GET parameters.

In the form, add a method="GET" attribute:

<form action="display.html" method="GET">
    <input type="text" name="serialNumber" />
    <input type="submit" value="Submit" />
</form>

When they submit this form, the user will be directed to an address which includes the serialNumber value as a parameter. Something like:

http://www.example.com/display.html?serialNumber=XYZ

You should then be able to parse the query string - which will contain the serialNumber parameter value - from JavaScript, using the window.location.search value:

// from display.html
document.getElementById("write").innerHTML = window.location.search; // you will have to parse
                                                                     // the query string to extract the
                                                                     // parameter you need

Pass form data from one html page to another html page and datase in flask

First, if you want to make a POST method, you need method to @app.route:

@app.route('/registered', methods=['GET', 'POST'])

Then, for your question, you can try the code:

@app.route('/signup')
def signup():
    return render_template("client_signup.html")
@app.route('/registered', methods=['GET', 'POST'])
def registered():
    userName = request.form['userName']
    userEmail = request.form['userEmail']
    userPassword = request.form['userPassword']
    conn = mysql.connect()
    cursor = conn.cursor()
    cursor.execute("INSERT INTO emp(userName, userEmail, userPassword) VALUES (%s,%s,%s)", (userName, userEmail, userPassword))
    return redirect("/signup")

The small change is return redirect("/signup")

How to pass data from one page to another page in html?

Both sessionStorage and localstorage will be work. You can choose anyone of this as per your requirement

sessionStorage,
Example:

  sessionStorage.setItem('name', 'my name');
  let data = sessionStorage.getItem('name');
  sessionStorage.removeItem('name');
  sessionStorage.clear();

localStorage:
Example :

       save data: localStorage.setItem('Name', 'My name');
       get data : localStorage.getItem('Name');
       remove data from local : localStorage.removeItem('Name');

I hope this will hellpful for you

Passing form data to javascript

Here is an alternative approach that might help:

You can see part of the following code in action at this link:
https://jsfiddle.net/m85yLoca/

<html>
<head></head>
<body>
<form id="frm1">
  First name: <input type="text" name="fname" id="fname"><br>
  Last name: <input type="text" name="lname" id="lname"><br><br>
  <input type="button" onclick="myFunction()" value="Submit">
</form>

<script>
function myFunction() {
  let fname = document.querySelector('#fname').value;
  let lname = document.querySelector('#lname').value;
  console.log(fname);
  console.log(lname);
}
</script>
</body>

I made sure to add id="" settings for the fname and lname form inputs. This can help us with individually specifying what input we want to access for later use.

This approach uses document.querySelector() to pinpoint which form input you are wanting to access. I get the value of the input via the .value part at the end of the document.querySelector() lines and then assign these to individual variables fname and lname.

Then, you can access the individual fname and lname variables in your function.

Passing Form Data to Another HTML Page