Auto-Submit Contact Form 7 Settings

formscrm.php

@@ -3,7 +3,7 @@
  * Plugin Name: FormsCRM
  * Plugin URI : https://close.technology/wordpress-plugins/formscrm/
  * Description: Connects Forms with CRM, ERP and Email Marketing.
- * Version: 4.2.1
+ * Version: 4.2.2-beta.1
  * Author: CloseTechnology
  * Author URI: https://close.technology
  * Text Domain: formscrm
@@ -23,7 +23,7 @@
 
 defined( 'ABSPATH' ) || die( 'No script kiddies please!' );
 
-define( 'FORMSCRM_VERSION', '4.2.1' );
+define( 'FORMSCRM_VERSION', '4.2.2-beta.1' );
 define( 'FORMSCRM_PLUGIN', __FILE__ );
 define( 'FORMSCRM_PLUGIN_URL', plugin_dir_url( __FILE__ ) );
 define( 'FORMSCRM_PLUGIN_PATH', plugin_dir_path( __FILE__ ) );

includes/assets/formscrm-admin.css

@@ -554,3 +554,32 @@
 	width: 1.5rem;
 	height: 1.5rem;
 }
+
+/* Contact Form 7 Auto-Submit Styles */
+@keyframes formscrm-rotation {
+	from {
+		transform: rotate(0deg);
+	}
+	to {
+		transform: rotate(359deg);
+	}
+}
+
+.formscrm-saving-indicator {
+	display: inline-flex;
+	align-items: center;
+	font-size: 14px;
+	margin-left: 10px;
+	color: #46b450;
+}
+
+.formscrm-saving-indicator .dashicons {
+	margin-right: 5px;
+	animation: formscrm-rotation 1s infinite linear;
+}
+
+.formscrm-submitting {
+	opacity: 0.6;
+	pointer-events: none;
+	cursor: wait;
+}

includes/assets/js/cf7-autosubmit.js

@@ -0,0 +1,99 @@
+/**
+ * Contact Form 7 Auto-Submit Script
+ *
+ * @package FormsCRM
+ * @version 4.2.2
+ */
+
+(function() {
+	'use strict';
+
+	// Wait for DOM to be ready.
+	if ( document.readyState === 'loading' ) {
+		document.addEventListener( 'DOMContentLoaded', initAutoSubmit );
+	} else {
+		initAutoSubmit();
+	}
+
+	/**
+	 * Initialize auto-submit functionality
+	 *
+	 * @return void
+	 */
+	function initAutoSubmit() {
+		// Get all select elements with auto-submit attribute.
+		var autoSubmitSelects = document.querySelectorAll( 'select[data-formscrm-autosubmit="true"]' );
+
+		if ( ! autoSubmitSelects.length ) {
+			return;
+		}
+
+		// Add change event listener to each select.
+		autoSubmitSelects.forEach( function( select ) {
+			select.addEventListener( 'change', function( event ) {
+				handleAutoSubmit( event.target );
+			});
+		});
+	}
+
+	/**
+	 * Handle auto-submit when select changes
+	 *
+	 * @param {HTMLElement} selectElement The select element that changed
+	 * @return void
+	 */
+	function handleAutoSubmit( selectElement ) {
+		// Prevent multiple submissions.
+		if ( selectElement.dataset.submitting === 'true' ) {
+			return;
+		}
+
+		// Find the closest form.
+		var form = selectElement.closest( 'form' );
+
+		if ( ! form ) {
+			console.warn( 'FormsCRM: Could not find parent form for auto-submit' );
+			return;
+		}
+
+		// Mark as submitting to prevent duplicate submissions.
+		selectElement.dataset.submitting = 'true';
+
+		// Show saving indicator.
+		var savingIndicator = selectElement.parentElement.querySelector( '.formscrm-saving-indicator' );
+		if ( savingIndicator ) {
+			savingIndicator.style.display = 'inline-flex';
+		}
+
+		// Add visual feedback class.
+		selectElement.classList.add( 'formscrm-submitting' );
+
+		// Disable browser "unsaved changes" warning.
+		disableUnsavedChangesWarning();
+
+		// Add a small delay to ensure user sees the feedback.
+		setTimeout( function() {
+			// Submit the form.
+			form.submit();
+		}, 300 );
+	}
+
+	/**
+	 * Disable "unsaved changes" warning
+	 *
+	 * Removes beforeunload event listeners to prevent the browser from
+	 * showing a confirmation dialog when the form is auto-submitted.
+	 *
+	 * @return void
+	 */
+	function disableUnsavedChangesWarning() {
+		// Clear the main beforeunload handler.
+		window.onbeforeunload = null;
+
+		// Remove jQuery beforeunload handlers (WordPress often uses jQuery).
+		if ( typeof jQuery !== 'undefined' ) {
+			jQuery( window ).off( 'beforeunload' );
+		}
+	}
+})();
+

includes/formscrm-library/class-contactform7.php

@@ -33,6 +33,7 @@ public function __construct() {
 		add_filter( 'wpcf7_editor_panels', array( $this, 'show_cm_metabox' ) );
 		add_action( 'wpcf7_after_save', array( $this, 'crm_save_options' ) );
 		add_action( 'wpcf7_before_send_mail', array( $this, 'crm_process_entry' ) );
+		add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_autosubmit_assets' ) );
 	}
 
 	/**
@@ -61,11 +62,13 @@ public function show_cm_metabox( $panels ) {
 	public function settings_add_crm( $args ) {
 		$cf7_crm_defaults = array();
 		$cf7_crm          = get_option( 'cf7_crm_' . $args->id(), $cf7_crm_defaults );
+		$settings_module  = isset( $cf7_crm['fc_crm_module'] ) ? $cf7_crm['fc_crm_module'] : '';
 		?>
 		<div class="metabox-holder">
 			<div class="cme-main-fields">
 				<p>
-					<select name="wpcf7-crm[fc_crm_type]" class="medium" onchange="jQuery(this).parents('form').submit();" id="fc_crm_type">
+					<label for="fc_crm_type"><?php esc_html_e( 'CRM Type:', 'formscrm' ); ?></label><br />
+					<select name="wpcf7-crm[fc_crm_type]" class="medium formscrm-autosubmit" id="fc_crm_type" data-formscrm-autosubmit="true">
 						<?php
 						foreach ( formscrm_get_choices() as $choice ) {
 							echo '<option value="' . esc_html( $choice['value'] ) . '" ';
@@ -76,6 +79,10 @@ public function settings_add_crm( $args ) {
 						}
 						?>
 					</select>
+					<span class="formscrm-saving-indicator" style="display:none; margin-left:10px; color:#46b450;">
+						<span class="dashicons dashicons-update-alt" style="animation: rotation 1s infinite linear;"></span>
+						<?php esc_html_e( 'Saving...', 'formscrm' ); ?>
+					</span>
 				</p>
 				<?php if ( isset( $cf7_crm['fc_crm_type'] ) && $cf7_crm['fc_crm_type'] ) { ?>
 
@@ -125,10 +132,11 @@ public function settings_add_crm( $args ) {
 					$this->crmlib = formscrm_get_api_class( $cf7_crm['fc_crm_type'] );
 					?>
 					<p>
-						<select name="wpcf7-crm[fc_crm_module]" class="medium" onchange="jQuery(this).parents('form').submit();" id="fc_crm_module">
+						<label for="fc_crm_module"><?php esc_html_e( 'CRM Module:', 'formscrm' ); ?></label><br />
+						<select name="wpcf7-crm[fc_crm_module]" class="medium formscrm-autosubmit" id="fc_crm_module" data-formscrm-autosubmit="true">
 							<?php
-							$settings_module = isset( $cf7_crm['fc_crm_module'] ) ? $cf7_crm['fc_crm_module'] : '';
-							foreach ( $this->crmlib->list_modules( $cf7_crm ) as $module ) {
+							$modules = $this->crmlib->list_modules( $cf7_crm );
+							foreach ( $modules as $module ) {
 								$value = '';
 								if ( ! empty( $module['value'] ) ) {
 									$value = $module['value'];
@@ -144,8 +152,17 @@ public function settings_add_crm( $args ) {
 								}
 								echo '>' . esc_html( $module['label'] ) . '</option>';
 							}
+							if ( empty( $settings_module ) || ! in_array( $settings_module, array_column( $modules, 'value' ), true ) ) {
+								$default_value            = ! empty( $modules[0]['value'] ) ? $modules[0]['value'] : '';
+								$settings_module          = $default_value;
+								$cf7_crm['fc_crm_module'] = $default_value;
+							}
 							?>
 						</select>
+						<span class="formscrm-saving-indicator" style="display:none; margin-left:10px; color:#46b450;">
+							<span class="dashicons dashicons-update-alt" style="animation: rotation 1s infinite linear;"></span>
+							<?php esc_html_e( 'Saving...', 'formscrm' ); ?>
+						</span>
 					</p>
 					<p>
 						<label for="wpcf7-crm-fc_crm_mode_expert"><?php esc_html_e( 'Expert Mode', 'formscrm' ); ?></label><br />
@@ -167,8 +184,8 @@ public function settings_add_crm( $args ) {
 				}
 			}
 
-			if ( isset( $cf7_crm['fc_crm_module'] ) && $cf7_crm['fc_crm_module'] ) {
-				$crm_fields  = $this->crmlib->list_fields( $cf7_crm, $cf7_crm['fc_crm_module'] );
+			if ( $settings_module ) {
+				$crm_fields  = $this->crmlib->list_fields( $cf7_crm, $settings_module );
 				$cf7_form    = WPCF7_ContactForm::get_instance( $args->id() );
 				$form_fields = ! empty( $cf7_form ) ? $cf7_form->scan_form_tags() : array();
 
@@ -317,6 +334,37 @@ public function get_merge_vars( $cf7_crm, $submitted_data ) {
 
 		return $merge_vars;
 	}
+
+	/**
+	 * Enqueue auto-submit assets for CF7 settings
+	 *
+	 * @param string $hook Hook suffix for the current admin page.
+	 * @return void
+	 */
+	public function enqueue_autosubmit_assets( $hook ) {
+		// Only load on CF7 edit pages.
+		if ( 'toplevel_page_wpcf7' !== $hook ) {
+			return;
+		}
+
+		// Enqueue CSS (reusing admin styles for consistency).
+		wp_enqueue_style(
+			'formscrm-admin',
+			FORMSCRM_PLUGIN_URL . 'includes/assets/formscrm-admin.css',
+			array(),
+			FORMSCRM_VERSION,
+			'all'
+		);
+
+		// Enqueue JavaScript.
+		wp_enqueue_script(
+			'formscrm-cf7-autosubmit',
+			FORMSCRM_PLUGIN_URL . 'includes/assets/js/cf7-autosubmit.js',
+			array(),
+			FORMSCRM_VERSION,
+			true
+		);
+	}
 }
 
 new FORMSCRM_CF7_Settings();

readme.txt

@@ -130,6 +130,9 @@ WordPress installation and then activate the Plugin from Plugins page.
 [Official Repository GitHub](https://github.com/closemarketing/formscrm/)
 
 == Changelog ==
+= 4.2.2 =
+*  Enhanced: Contact Form 7 module selection now auto-saves configuration with visual feedback.
+
 = 4.2.1 =
 *  Hotfix: Error not sending correctly entry id in webhook.