How can I activate the cancel button in the confirm dialog with Django?

I am using javascript with the Django framework to show the confirmation dialog message before submitting the blog. But the problem is when the user clicks the cancel button, it still performs and posts the blog.

<body>

        <form method="POST" enctype="multipart/form-data" class="new-qiestion-form" id="FormConfirmation">
            {% csrf_token %}
            <div class="fieldWraber">
                <label for="{{form.title.id_for_label}}">Title</label>
                
                {{form.title}}
                <span style="text-align: right;" class="error">{{form.title.errors}}</span>
            </div>
            <div class="fieldWraber">
                <label for="{{form.body.id_for_label}}"><bdi> Tags </bdi></label>
                <input type="text" data-role="tagsinput" class="form-control" name="tags" required>
            </div>

            <div  class="fieldWraber">
                <label for="{{form.body.id_for_label}}">Content</label>
                <bdi dir="rtl" style="text-align: right;">
                {{form.body}}
                <span style="text-align: right;" class="error">{{form.body.errors}}</span>
                </bdi>
            </div>

            
            <div class="fieldWraber">
                <label for="{{form.body.id_for_label}}"><bdi>اضافة مرفق:</bdi></label>
                {{form.attach}}
            </div>

        <div>
            <button type="submit" onclick="clicked();" class="submit-button" style="color: aliceblue;">
                <i class="fa fa-paper-plane" aria-hidden="true"></i>
                Submit
            </button>
        </div>

        </form>
    </div>
</div>
<script type="text/javascript">
    function clicked() {
        if (confirm('Do you want to submit?')) {
            document.getElementById("FormConfirmation").submit();
        } else {
            return false;
        }
    }
</script> 


</body>
{% endblock %}
Back to Top