Why my task item not insert in mysql databse table

Question

I want to make a flask TODO app, but my flask app task item does not insert in the database.

here my app.py code

from flask import Flask , render_template , request 

import mysql.connector
import os

app = Flask(__name__)

app.secret_key = os.urandom(24)


conn = mysql.connector.connect(host='localhost',
                          database='to_do',
                          user=' root',
                          password='')

cursor= conn.cursor()

@app.route('/')
def index():
    return render_template('index.html')



@app.route('/submit_form' , methods = ['POST'])
def form_submit():
if request.method == 'POST':
    task = request.form['task']
    
    # Write query

    # cursor.execute('INSERT INTO `tasks` ( id ,title) VALUES (NULL , %s)' , (task))

    cursor.execute("INSERT INTO `tasks` (tilte) VALUES(%s)" , (task))

    conn.commit()


    return f'Your Submit Task : {task}'



if __name__=='__main__':
    app.run(debug=True)

Here my HTML code

<!DOCTYPE html>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="shortcut icon" type="image/x-icon" href="images/">   
    <link rel="stylesheet" type="text/css" href="{{url_for ('static', filename = 'bootstrap.min.css')}}">
    <title>TODO PRACTICE</title>
</head>
<body>

    <!-- Start Navbar -->

    <div class="container mt-5">
        <nav class="navbar navbar-expand-lg bg-light navbar-light">
            <!-- <a class="navbar-brand" href="">TODO</a> -->
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#first">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse" id="first">
                <ul class="navbar-nav mr-auto">
                    <li class="nav-item active">
                        <a class="nav-link" href="#">Home<span class="sr-only">(current)</span></a>
                    </li>
                </ul>
            </div>      
        </nav>          
    </div>

    <!-- Navbar End -->

    <!-- Alert -->

    <div class="container mt-4">
        <div class="alert alert-warning alert-dismissible fade show" role="alert">
            <strong>Warning!</strong> You should check in on some of those fields below.
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button>
        </div>
    </div>


    <!-- Add Task -->

    <div class="container mt-4">
        <form action="/submit_form" method="POST">
            <div class="row justify-content-center">
                <div class="col-md-8">
                    <input class="form-control" type="text" name="task" placeholder="Add Your Task">
                </div>
                <div class="col-md-2">
                    <input class="btn btn-success" type="submit" value="Add Task">
                </div>
            </div>
        </form>
    </div>

    <!-- End Add Task -->


    <!-- TODO List -->

    <div class="container mt-4">
        <div class="card">
            <div class="card-header">
                <h2 class="lead text-center">Your TODO List</h2>
            </div>
            <div class="card-body">
                <table class="table table-bordered table-hover">
                    <tr>
                        <th width="10%" class="text-center">SL</th>
                        <th>TODO Title</th>
                        <th width="20%" class="text-center">Action</th>
                    </tr>
                    <tr>
                        <td width="10%" class="text-center">1</td>
                        <td>Learnig Web Development</td>
                        <td width="20%" class="text-center">
                            <input type="submit" value="Edit" class="btn btn-primary" name="">
                            <input type="submit" value="Delete" class="btn btn-danger" name="">
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>


    <!-- JS File -->

    <script src="{{url_for('static' , filename = 'jquery-3.4.1.min.js')}}"></script>
    <script src="{{url_for('static' , filename = 'popper.min.js')}}"></script>
    <script src="{{url_for('static' , filename = 'bootstrap.min.js')}}"></script>


    <!-- Main JS -->


</body>

This is my SQL database table

id  title   created_at

And this is ERROR

mysql.connector.errors.ProgrammingError: 1064 (42000): You have an error in your SQL syntax; check the manual that corresponds to your MariaDB server version for the right syntax to use near '%s)' at line 1

Traceback (most recent call last)

score 0 · Answer 1 · answered Apr 26 '21 at 06:00

0

Take a look at this line:

cursor.execute("INSERT INTO `tasks` (tilte) VALUES(%s)" , (task))

I do believe tilte should be title.

answered Apr 26 '21 at 06:00

matigo

1,321
1
6
16

Don't post full answers for trivial typos like this. Just post as a comment. – Barmar Apr 26 '21 at 22:32

score 0 · Answer 2 · answered Apr 26 '21 at 22:30

Python is ignoring the parenthesis in (task), write it like this:

cursor.execute("INSERT INTO tasks (title) VALUES (%s)", (task, ))

Explanation

Python gets confused with single item tuples. When you write (task) Python thinks you meant task, since it evaluates like an expression (for ex: (tasks + 1) * 2).

To tell Python that you meant it to be a tuple, write like this: (task, ).

Checkout this answer for a detailed explanation.

Why my task item not insert in mysql databse table

2 Answers2