Попытка отправить данные формы через AJAX на маршрут во фляге, но получить сообщение POST http://localhost:8080/process 500 (внутренняя ошибка сервера)

Question

У меня есть форма.

  <form>
 <input type="text" id="name" name="name" required />

 <input type="url" id="url" name="url"/>

 <input id="mdp-demo" name = "mdp-demo">

<input type="submit" name="submit" value="Submit">
  </form>

У меня есть файл javascript, который отправляет мои отправленные данные в мой маршрут процесса.

 $(document).ready(function() {

$('form').on('submit', function(event) {

    $.ajax({
        data : {

            url : $('#url').val(),
            name : $('#name').val(),
            date : $('#mdp-demo').val()
        },
        type : 'POST',
        url : '/process'
    })


    event.preventDefault();

});

});

И, наконец, у меня есть маршрут процесса, на который отправляются данные.

@app.route('/process', methods=['POST'])
def process():
    if request.method == 'POST':
        url = request.form['url']
        name = request.form['name']
        dates = request.form['mdp-demo']
        return jsonify({'name': name})
    else:
         return render_template('index.html')

это дает мне 400 неверных запросов: KeyError: 'url' в моей IDE. В браузере выдает ошибку jquery.min.js: 4 POST http://localhost:8080/process, что означает, что данные формы не отправляются в мой маршрут процесса.

Есть идеи, что я делаю не так?