Ziyal
Ziyal

Reputation: 15

How to I route to an MySQL ID in Flask based on the entry selected?

I'm new to Python and am currently creating a page using Flask and MySQL that allows information (First name, last name, and email) to be submitted to a database and displayed on my index.html.

The part I'm having a challenge with is is having the edit button for each entry to take the user to a URL (in this case, "/friends/id/edit") which will display an edit page for that particular user. How do I write it in a way which allows it to goes to the proper URL and edits the proper information in the database?

My server.py file:

    @app.route('/', methods=["GET"])
def index():
    query = "SELECT * FROM friends"
    friends = mysql.query_db(query)
    return render_template('index.html', all_friends=friends)

@app.route('/friends', methods=["POST"])
def create():
        if len(request.form['email']) < 1:
            flash("Email cannot be blank.", "error")
            return redirect('/')
        if not EMAIL_REGEX.match(request.form['email']):
            flash("Invalid email address", "error")
            return redirect('/')
        else:
            query = "INSERT INTO friends (first_name, last_name, email, created_at) VALUES (:first_name, :last_name, :email, NOW())"
            data = {
                    'first_name': request.form['first_name'],
                    'last_name': request.form['last_name'],
                    'email': request.form['email']
                    }

            mysql.query_db(query, data)    
            query= "SELECT * FROM friends"
            friend = mysql.query_db(query)
            return render_template('index.html', all_friends=friend)

@app.route('/friends/<id>/edit', methods=["GET"])
def edit(id):
        return render_template('/edit.html')

index.html:

    <!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Full Friends</title>
  </head>
  <body>
    <h1>Full Friends</h1>
    {% for friend in all_friends: %}
       <p>ID: {{ friend['id'] }} First Name: {{ friend['first_name'] }} Last Name: {{ friend['last_name'] }} Email: {{ friend['email'] }} Timestamp: {{ friend['timestamp'] }} <form action="/friends/<id>/edit" method=["GET"]><input id="edit" type="submit" value="Edit"></form> <form action="/friends/<id>/delete"><input id="delete" type="submit" method="POST" value="Delete"></form></p>
    {% endfor %}

    <div id="add_contact">
      {% with messages = get_flashed_messages(with_categories=true) %}
        {% if messages %}
          <ul class=flashes>
          {% for category, message in messages %}
            <li class="{{ category }}">{{ message }}</li>
          {% endfor %}
          </ul>
        {% endif %}
      {% endwith %}

      <form action="/friends" method="POST">
        <p class="titles">First Name:</p><input type="text" name="first_name">
        <p class="titles">Last Name:</p><input type="text" name="last_name">
        <p class="titles">Email:</p><input type="text" name="email"><br>
        <input type="submit" value="Add Friend">
      </form>
    </div>
  </body>
</html>

Upvotes: 0

Views: 1886

Answers (2)

gipsy
gipsy

Reputation: 3859

I believe you are looking to create 'edit' links in your template, which you can achieve like below. You don't need a 'form' for that.: You can style the link to look like a button using css.

{% for friend in all_friends: %}
     <p>
    <a href="/friends/{{friend['id']}}/edit">Edit</a>
    </p>
{% endfor %}

Upvotes: 1

V&#225;clav Kondula
V&#225;clav Kondula

Reputation: 21

As long as you don't care about security. You can do something like this.

server.py file:

@app.route('/friends/<id>/edit', methods=["GET"])
def edit(id):
    return render_template('/edit.html', id=id)

@app.route('/friends/<id>/edit', methods=["POST"])
def edit(id):
    # Do anything with the POST data
    # and modify database
    return render_template('/edit.html', id=id)

edit.html file:

<html>
<head>
    <meta charset="utf-8">
    <title>Full Friends</title>
</head>
<body>
  <span> friend id: {{ id }} </span>
  <form action="/friends/{{ id }}/edit" method="POST">
    <p class="titles">First Name:</p><input type="text" name="first_name">
    <p class="titles">Last Name:</p><input type="text" name="last_name">
    <p class="titles">Email:</p><input type="text" name="email"><br>
    <input type="submit" value="Modify Friend">
  </form>
</body>
</html>

The idea here is that you have just one template that you populate with data from database and you can distinguish users in post request by their ID.

[EDIT] I misread your question. You have to also replace /friends/<id>/edit by /friends/{{ friend['id'] }}/edit in your index.html . This way you have unique link for every user. And you can use the ID to search the database and populate the template with user information.

Upvotes: 1

Related Questions