As an experienced website operations expert, I am well aware of the crucial role of user experience in the success of a website, and the feedback mechanism after form submission is an important part of the user experience.The AnQiCMS provides us with great flexibility and customizability, offering us a high degree of freedom to refine this process.Today, let's delve into how to customize the success or failure prompt information and page redirection strategy after submitting a comment form in AnQiCMS.

Understanding AnQiCMS form submission mechanism

In AnQi CMS, the functionality of the message form is byguestbookLabel support provided.When you build a comment form, the core is in its submission method and the backend response handling.

  1. HTML mode (return=html)This is the default mode.When the form is submitted, the server will directly return an HTML page as the response.This means that if the submission is successful or fails, the server will render a complete HTML page to display the prompt information, or perform a page redirect.
  2. JSON mode (return=json)In this mode, after the form is submitted, the server will not return a complete HTML page, but a JSON-formatted data.This method is usually used for asynchronous submission (AJAX), allowing front-end JavaScript code to receive response data and dynamically handle prompts and page transitions.

Understanding these two modes is the foundation of customization operations, as they directly determine whether you need to modify the backend rendering template files or the frontend handling response JavaScript code.

Customize success/failure prompts and page redirection: HTML mode (backend processing)

In HTML mode, after the user submits the form, if not configured specifically, AnQiCMS usually reloads the page before submission and passes the success or failure status and information through some mechanism (such as URL parameters or flash messages) on the page. To achieve more personalized prompts and page jumps, we can operate in two ways:

Firstly, the most direct way is to use the template file (usually the one you use to display the comment form)guestbook/index.html）中，based on the status variable passed by the backend, different prompt information is displayed. For example, the backend may pass a variable to the template after a successful submission,success_messageor pass one when failed.error_message. You can inguestbook/index.htmlauto added condition judgment:

{# guestbook/index.html 示例片段 #}
{% if success_message %}
    <div class="alert alert-success">{{ success_message }}</div>
    <meta http-equiv="refresh" content="3;url=/thank-you.html"> {# 3秒后跳转到感谢页面 #}
{% endif %}

{% if error_message %}
    <div class="alert alert-danger">{{ error_message }}</div>
    <p>请检查您的输入并重试。</p>
{% endif %}

{# ... 其他表单代码 ... #}

auto not only displayed the message, but also<meta http-equiv="refresh">auto implemented a simple timed jump with the tag. You need to ensure/thank-you.htmlIt is a real existing page used to display thank you information.

Secondly, more advanced customizations if it involves jumping to a page after submissionA completely different independent pageFor example, a dedicated 'Thank You' page or 'Error'