form.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>New Article Form</h1>
    <h2> test </h2>h2>
    <input type="text" id="title" placeholder= "Title"><br><br>
    <textarea name="" id="content" cols="30" rows="10" placeholder="Add Content"></textarea><br>
    <button type="submit" id="save">Submit</button>

    <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
    <script>
        $('#save').click(function(){
            let article = {
                title : $('#title').val(),
                content : $('#content').val()
            }
            //console.log(article);
            $.ajax({
                type: 'POST',
                url: '/article/new',
                data: article,
                success: response => {
                    console.log(response);
                },
                error: response => {
                    console.log(response);
                }
            })
        })
    </script>
</body>
</html>