• Resolved caddyboy0103

    (@caddyboy0103)


    I am trying to put a CF7 contact form within a modal and i am receiving the spinning loader. Once i turn off ajax load, the form works, however it refreshes the page which means the user would need to open the form again to see if there’s any errors. They would also need to do the same thing if the form is successfully transmitted.

    if ( ! defined( 'WPCF7_LOAD_JS' ) ) {
    	define( 'WPCF7_LOAD_JS', true );
    	//define( 'WPCF7_LOAD_JS', false );
    }

    Is there any viable solution to this problem?

    I’ve added scripts to the functions.php file within my theme

    function my_scripts() {
        wp_enqueue_script( 'boot1','https://code.jquery.com/jquery-3.3.1.min.js"', array( 'jquery' ),'',true );
        wp_enqueue_script( 'boot2','https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js', array( 'jquery' ),'',true );
        wp_enqueue_script( 'boot3','https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js', array( 'jquery' ),'',true );
        wp_enqueue_script( 'boot4','/wp-content/themes/site/assets/services.js', array( 'jquery' ),'',true );
    }
    add_action( 'wp_enqueue_scripts', 'my_scripts' );

    This is the actual modal code

    <div class="modal fade launch-contac-us-modal" id="contact-formModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLabel">Contact Us</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>
          <div id="contact-form-modal-body" class="modal-body">
    		
    	<!-- Start Contact form Modal -->
            <?php echo $contact_form_content; ?>
            <?php echo do_shortcode( '[contact-form-7 id="128" title="Contact form"]' ); ?>
    
          </div>
        </div>
      </div>
    </div>
    • This topic was modified 6 years, 7 months ago by caddyboy0103.
    • This topic was modified 6 years, 7 months ago by caddyboy0103.
    • This topic was modified 6 years, 7 months ago by caddyboy0103.
Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter caddyboy0103

    (@caddyboy0103)

    After removing wp_enqueue_script and placing all of my script in the footer of my theme (and placed the contact form there as well) and change the following to true

    define( 'WPCF7_LOAD_JS', true );

    I am receiving the following 404 error

    /wp-json/contact-form-7/v1/contact-forms/128/feedback

    Here’s what’s loaded in the .htaccess file

    # BEGIN WordPress
    <IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    RewriteRule ^index\.php$ - [L]
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule . /index.php [L]
    </IfModule>
    
    # END WordPress

    made sure permalinks was re-saved to “post name”

    Thread Starter caddyboy0103

    (@caddyboy0103)

    That didn’t take long at all…..

    Seems i was missing the following within my apache2 website teamplate

    <Directory /var/www/vhosts/folder/sitename/httpdocs>
    AllowOverride Fileinfo Options
    </Directory>

    While i had permalinks enabled, without the code above, they were not working….

    • This reply was modified 6 years, 7 months ago by caddyboy0103.
Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘CF7 and Bootstrap 4.3 Modal’ is closed to new replies.