Topic Tag: Toolset Forms

Problem: I have a CRED form displayed in a Bootstrap modal. The form creates a new child post and uses AJAX submission. After the form is submitted, I would like to show a success confirmation message in a modal. When the modal is closed, I would like the user to be able to submit the CRED form again and add another child post.

Solution: Use separate modals to show the form and the success message. Use some JavaScript that will test for your form's successful submission by observing URL parameters. When the URL parameters are found, trigger your confirmation modal.

if((QueryString['_success_message'] == "117_0") && location.hash=="#cred_form_117_0"){
  jQuery('#confirmationModal').modal();
}

Modify the values to reflect your actual CRED form URL parameters.

Listen to the "hidden.bs.modal" event on the confirmation modal, and use it to refresh the page by setting the location.href to be the page's URL without any paramters or hash:

jQuery('#confirmationModal').on('hidden.bs.modal', function () {
    // when modal is hidden, do something here
    location.href = window.location.href.split("?")[0];
}

Problem:
The client wanted to use CSS to customise the WordPress login form

Solution:
As described below (https://toolset.com/forums/topic/login-form-css/#post-518231) using the browser dev tools enables you to inspect the page markup and identify which CSS selectors can be used to target the elements you want to modify.

Relevant Documentation:
https://toolset.com/faq/learning-basic-html-and-css/