add filter that will extended the form field container html attributes…

classes/controllers/FrmFieldsController.php

@@ -64,12 +64,13 @@ public static function create() {
 		FrmAppHelper::permission_check( 'frm_edit_forms' );
 		check_ajax_referer( 'frm_ajax', 'nonce' );
 
-		$field_type = FrmAppHelper::get_post_param( 'field_type', '', 'sanitize_text_field' );
-		$form_id    = FrmAppHelper::get_post_param( 'form_id', 0, 'absint' );
+		$field_type    = FrmAppHelper::get_post_param( 'field_type', '', 'sanitize_text_field' );
+		$form_id       = FrmAppHelper::get_post_param( 'form_id', 0, 'absint' );
+		$field_options = FrmAppHelper::get_post_param( 'field_options', array(), 'wp_kses_post' );
 
 		do_action( 'frm_before_create_field', $field_type, $form_id );
 
-		$field = self::include_new_field( $field_type, $form_id );
+		$field = self::include_new_field( $field_type, $form_id, $field_options );
 
 		// this hook will allow for multiple fields to be added at once
 		do_action( 'frm_after_field_created', $field, $form_id );
@@ -82,12 +83,17 @@ public static function create() {
 	 *
 	 * @param string $field_type
 	 * @param int    $form_id
+	 * @param array  $field_options
 	 *
 	 * @return array|false
 	 */
-	public static function include_new_field( $field_type, $form_id ) {
+	public static function include_new_field( $field_type, $form_id, $field_options = array() ) {
 		$field_values = FrmFieldsHelper::setup_new_vars( $field_type, $form_id );
 
+		if ( ! empty( $field_options ) ) {
+			$field_values['field_options'] = array_merge( $field_values['field_options'], $field_options );
+		}
+
 		// When a new field is added to the form, flag it as draft and hide it from the front-end.
 		$field_values['field_options']['draft'] = 1;
 
@@ -182,6 +188,17 @@ public static function load_single_field( $field_object, $values, $form_id = 0 )
 			$field                        = FrmFieldsHelper::setup_edit_vars( $field_object );
 		}
 
+		/**
+		 * Filter for adding extra attributes to the field container.
+		 *
+		 * @since x.x
+		 *
+		 * @param array $extra_field_attributes
+		 * @param array $field
+		 * @param array $display
+		 */
+		$extra_field_attributes = apply_filters( 'frm_field_container_extra_attributes', array(), $field, $display );
+
 		$li_classes  = self::get_classes_for_builder_field( $field, $display, $field_obj );
 		$li_classes .= ' ui-state-default widgets-holder-wrap';
 

classes/controllers/FrmStylesController.php

@@ -124,7 +124,6 @@ public static function admin_init() {
 		self::load_pro_hooks();
 
 		$version = FrmAppHelper::plugin_version();
-		wp_enqueue_script( 'jquery-ui-datepicker' );
 
 		if ( FrmAppHelper::is_style_editor_page( 'edit' ) ) {
 			wp_enqueue_style( 'wp-color-picker' );
@@ -541,7 +540,7 @@ private static function setup_styles_and_scripts_for_styler() {
 		$version         = FrmAppHelper::plugin_version();
 		$js_dependencies = array( 'wp-i18n', 'wp-hooks', 'formidable_dom' );
 
-		if ( FrmAppHelper::pro_is_installed() ) {
+		if ( FrmAppHelper::pro_is_installed() && is_callable( 'FrmProAppHelper::use_jquery_datepicker' ) && FrmProAppHelper::use_jquery_datepicker() ) {
 			$js_dependencies[] = 'jquery-ui-datepicker';
 		}
 

classes/models/fields/FrmFieldType.php

@@ -367,6 +367,7 @@ protected function default_field_settings() {
 			'readonly_required' => false,
 			'unique'            => false,
 			'read_only'         => false,
+			'range_field'       => false,
 			'description'       => true,
 			'options'           => true,
 			'label_position'    => true,

classes/views/frm-fields/back-end/settings.php

@@ -124,7 +124,6 @@
 				</div>
 				<?php
 			}
-
 			do_action( 'frm_field_options_form_top', $field, $display, $values );
 			?>
 		</div>

classes/views/frm-forms/add_field.php

@@ -3,7 +3,7 @@
 	die( 'You are not allowed to call this page directly.' );
 }
 ?>
-<li id="frm_field_id_<?php echo esc_attr( $field['id'] ); ?>" class="<?php echo esc_attr( $li_classes ); ?>" data-fid="<?php echo esc_attr( $field['id'] ); ?>" data-formid="<?php echo esc_attr( 'divider' === $field['type'] && isset( $field['form_select'] ) ? $field['form_select'] : $field['form_id'] ); ?>" data-ftype="<?php echo esc_attr( $display['type'] ); ?>" data-type="<?php echo esc_attr( $field['type'] ); ?>">
+<li id="frm_field_id_<?php echo esc_attr( $field['id'] ); ?>" class="<?php echo esc_attr( $li_classes ); ?>" data-fid="<?php echo esc_attr( $field['id'] ); ?>" data-formid="<?php echo esc_attr( 'divider' === $field['type'] && isset( $field['form_select'] ) ? $field['form_select'] : $field['form_id'] ); ?>" data-ftype="<?php echo esc_attr( $display['type'] ); ?>" data-type="<?php echo esc_attr( $field['type'] ); ?>" <?php FrmAppHelper::array_to_html_params( $extra_field_attributes, true ); ?>>
 <?php
 if ( $field['type'] === 'divider' ) {
 	$icon_class = empty( $field['form_select'] ) ? 'frm-form-title-style' : 'frm_repeat_icon';

js/admin/settings.js

@@ -1,5 +1,4 @@
 ( function() {
-
 	function addEventListeners() {
 		document.addEventListener( 'change', handleChangeEvent );
 		document.addEventListener( 'keydown', handleKeyDownEvent );

js/admin/style.js

@@ -1446,6 +1446,11 @@
 	 * @returns {void}
 	 */
 	function initDatepickerSample() {
+		// If flatpickr is defined, then is a recent version of Pro which handles the datepicker preview as it's a PRO feature.
+		if ( 'undefined' !== typeof flatpickr ) {
+			return;
+		}
+
 		const $sample = jQuery( '#datepicker_sample' );
 		if ( $sample.length && 'function' === typeof $sample.datepicker ) {
 			$sample.datepicker({ changeMonth: true, changeYear: true });

js/formidable_admin.js

@@ -364,7 +364,7 @@ function frmAdminBuildJS() {
 		wp.hooks.doAction( 'frmAdmin.beforeOpenConfirmModal', { $info, link });
 
 		$info.dialog( 'open' );
-		continueButton.setAttribute( 'href', link.getAttribute( 'href' ) );
+		continueButton.setAttribute( 'href', link.getAttribute( 'href' ) || link.getAttribute( 'data-href' ) );
 		return false;
 	}
 
@@ -1650,6 +1650,8 @@ function frmAdminBuildJS() {
 				let replaceWith;
 				document.getElementById( 'frm_form_editor_container' ).classList.add( 'frm-has-fields' );
 				const $siblings = $placeholder.siblings( 'li.form-field' ).not( '.edit_field_type_end_divider' );
+				const fieldId   = checkMsgForFieldId( msg );
+
 				if ( ! $siblings.length ) {
 					// if dragging into a new row, we need to wrap the li first.
 					replaceWith = wrapFieldLi( msg );
@@ -1675,11 +1677,43 @@ function frmAdminBuildJS() {
 					makeDraggable( replaceWith.get( 0 ), '.frm-move' );
 				}
 
+				if ( fieldId ) {
+					/**
+					 * Fires after a field is added.
+					 *
+					 * @since x.x
+					 *
+					 * @param {Object} fieldData            The field data.
+					 * @param {String} fieldData.field      The field HTML.
+					 * @param {String} fieldData.field_type The field type.
+					 * @param {String} fieldData.form_id    The form ID.
+					 */
+					wp.hooks.doAction( 'frmadmin.afterFieldAddedInFormBuilder', {
+						field: msg,
+						fieldId: fieldId,
+						fieldType: fieldType,
+						form_id: formId,
+					});	
+				}
+
 			},
 			error: handleInsertFieldError
 		});
 	}
 
+	/**
+	 * Get the field ID from the response message.
+	 *
+	 * @since x.x
+	 *
+	 * @param {String} msg
+	 * @return {Number}
+	 */
+	function checkMsgForFieldId( msg ) {
+		const result = msg.match( /data-fid="(\d+)"/ );
+		return result ? parseInt( result[1] ) : 0;
+	}
+
 	function getFieldIdsInSubmitRow() {
 		const submitField = document.querySelector( '.edit_field_type_submit' );
 		if ( ! submitField ) {
@@ -2066,8 +2100,9 @@ function frmAdminBuildJS() {
 			success: function( msg ) {
 				document.getElementById( 'frm_form_editor_container' ).classList.add( 'frm-has-fields' );
 				const replaceWith = wrapFieldLi( msg );
-
+				const fieldId     = checkMsgForFieldId( msg );
 				const submitField = $newFields[0].querySelector( '.edit_field_type_submit' );
+
 				if ( ! submitField ) {
 					$newFields.append( replaceWith );
 				} else {
@@ -2082,12 +2117,82 @@ function frmAdminBuildJS() {
 						makeDraggable( this.querySelector( '.form-field' ), '.frm-move' );
 					}
 				);
+
+				if ( fieldId ) {
+					/**
+					 * Fires after a field is added.
+					 *
+					 * @since x.x
+					 *
+					 * @param {Object} fieldData            The field data.
+					 * @param {String} fieldData.field      The field HTML.
+					 * @param {String} fieldData.field_type The field type.
+					 * @param {String} fieldData.form_id    The form ID.
+					 */
+					wp.hooks.doAction( 'frmadmin.afterFieldAddedInFormBuilder', {
+						field: msg,
+						fieldId: fieldId,
+						fieldType: fieldType,
+						form_id: formId,
+					});	
+				}
 			},
 			error: handleInsertFieldError
 		});
 		return false;
 	}
 
+	function insertFormField( fieldType, fieldOptions = {} ) {
+
+		return new Promise( ( resolve ) => {			
+			const formId = thisFormId;
+			let hasBreak = 0;
+
+			if ( 'summary' === fieldType ) {
+				hasBreak = $newFields.children( 'li[data-type="break"]' ).length > 0 ? 1 : 0;
+			}
+
+			jQuery.ajax({
+				type: 'POST',
+				url: ajaxurl,
+				data: Object.assign( getInsertNewFieldArgs( fieldType, 0, formId, hasBreak ), { field_options: fieldOptions } ),
+				success: function( msg ) {
+					const fieldElement = jQuery( msg );
+					const fieldId      = checkMsgForFieldId( msg );
+
+					fieldElement[0].style.display = 'none';
+					resolve( fieldElement );
+					setTimeout( () => {
+						updateFieldOrder();
+						afterAddField( msg, true );
+						syncLayoutClasses( jQuery( fieldElement.closest( 'ul' ).children()[0] ) );
+						fieldElement[0].style.display = 'block';
+
+						if ( fieldId ) {
+							/**
+							 * Fires after a field is added.
+							 *
+							 * @since x.x
+							 *
+							 * @param {Object} fieldData            The field data.
+							 * @param {String} fieldData.field      The field HTML.
+							 * @param {String} fieldData.field_type The field type.
+							 * @param {String} fieldData.form_id    The form ID.
+							 */
+							wp.hooks.doAction( 'frmadmin.afterFieldAddedInFormBuilder', {
+								field: msg,
+								fieldId: fieldId,
+								fieldType: fieldType,
+								form_id: formId,
+							});
+						}
+					}, 10 );
+				},
+				error: handleInsertFieldError
+			});
+		} );
+	}
+
 	function maybeHideQuantityProductFieldOption() {
 		let hide = true,
 			opts = document.querySelectorAll( '.frmjs_prod_field_opt_cont' );
@@ -11061,7 +11166,10 @@ function frmAdminBuildJS() {
 		loadApiEmailForm,
 		addMyEmailAddress,
 		fillDropdownOpts,
-		showSaveAndReloadModal
+		showSaveAndReloadModal,
+		deleteField,
+		insertFormField,
+		confirmLinkClick
 	};
 }
 

stubs.php

@@ -79,6 +79,8 @@ public static function plugin_url() {
 		 */
 		public static function get_updater() {
 		}
+		public static function use_jquery_datepicker() {
+		}
 	}
 	class FrmProEntryMetaHelper {
 		public static function get_post_or_meta_value( $entry, $field, $atts = array() ) {