Gravity Wiz // Gravity Forms // Checkbox Count

gw-gravity-forms-checkbox-count.php

<?php
/**
 * --------------------------------------------------------------------------
 * IMPORTANT!
 * This snippet has been superceded by the Choice Counter snippet. 
 * https://gist.github.com/spivurno/00af5ee7e21dd5d6903fbae6fecd85ce
 * --------------------------------------------------------------------------
 * 
 * Gravity Wiz // Gravity Forms // Checkbox Count
 *
 * Get the total number of checkboxes checked. Useful when wanting to apply conditional logic based on the number of
 * checkboxes checked.
 *
 * @version   2.5
 * @author    David Smith <david@gravitywiz.com>
 * @license   GPL-2.0+
 * @link      http://gravitywiz.com/...
 * @copyright 2018 Gravity Wiz
 */
class GW_Checkbox_Count {

	private static $is_script_output;

	function __construct( $args ) {

		$this->_args = wp_parse_args( $args, array(
			'form_id'            => false,
			'count_field_id'     => false,
			'checkbox_field_id'  => null,
			'checkbox_field_ids' => false
		) );

		if( isset( $this->_args['checkbox_field_id'] ) ) {
			$this->_args['checkbox_field_ids'] = array( $this->_args['checkbox_field_id'] );
		}

		add_filter( 'gform_pre_render',            array( $this, 'load_form_script' ), 10, 2 );
		add_action( 'gform_register_init_scripts', array( $this, 'add_init_script' ) );
		//add_action( 'gform_pre_validation',        array( $this, 'override_submitted_value') );

	}

	public function load_form_script( $form, $is_ajax_enabled ) {

		if( $this->is_applicable_form( $form ) && ! has_action( 'wp_footer', array( $this, 'output_script' ) ) ) {
			add_action( 'wp_footer', array( $this, 'output_script' ) );
			add_action( 'gform_preview_footer', array( $this, 'output_script' ) );
		}

		return $form;
	}

	function output_script() {
		?>

		<script type="text/javascript">

			( function( $ ) {

				window.GWCheckboxCount = function( args ) {

					var self = this;

					// copy all args to current object: formId, fieldId
					for( prop in args ) {
						if( args.hasOwnProperty( prop ) )
							self[prop] = args[prop];
					}

					self.init = function() {

						for( var i = 0; i < self.checkboxFieldIds.length; i++ ) {

							var checkboxFieldId = self.checkboxFieldIds[ i ],
								checkboxField   = $( '#input_' + self.formId + '_' + checkboxFieldId );

							checkboxField.find( 'input[type="checkbox"]' ).click( function() {
								self.updateCheckboxCount( self.formId, self.checkboxFieldIds, self.countFieldId );
							} );

						}

						self.updateCheckboxCount( self.formId, self.checkboxFieldIds, self.countFieldId );

					};

					self.updateCheckboxCount = function( formId, checkboxFieldIds, countFieldId ) {

						var countField    = $( '#input_' + formId + '_' + countFieldId ),
							count         = 0;

						for( var i = 0; i < checkboxFieldIds.length; i++ ) {

							var checkboxField = $( '#input_' + formId + '_' + checkboxFieldIds[ i ] );

							count += checkboxField.find( 'input[type="checkbox"]' ).filter(':checked').not(' #choice_' + checkboxFieldIds[ i ] + '_select_all').length;

						}

						if( parseInt( countField.val() ) != parseInt( count ) ) {
							countField.val( count ).change();
						}

					};

					self.init();

				}

			} )( jQuery );

		</script>

		<?php
		self::$is_script_output = true;
	}

	function add_init_script( $form ) {

		if( ! $this->is_applicable_form( $form['id'] ) )
			return;

		$args = array(
			'formId'           => $this->_args['form_id'],
			'countFieldId'     => $this->_args['count_field_id'],
			'checkboxFieldIds' => $this->_args['checkbox_field_ids']
		);

		$script = 'new GWCheckboxCount( ' . json_encode( $args ) . ' );';
		$slug = implode( '_', array( 'gw_checkbox_count', $this->_args['form_id'], $this->_args['count_field_id'] ) );

		GFFormDisplay::add_init_script( $this->_args['form_id'], $slug, GFFormDisplay::ON_PAGE_RENDER, $script );

		return;
	}

	function override_submitted_value( $form ) {
		//$_POST["input_{$this->count_field_id}"] = $day_count;
		return $form;
	}

	public function is_applicable_form( $form ) {

		$form_id = isset( $form['id'] ) ? $form['id'] : $form;

		return empty( $this->_args['form_id'] ) || $form_id == $this->_args['form_id'];
	}

	public function is_ajax_submission( $form_id, $is_ajax_enabled ) {
		return isset( GFFormDisplay::$submission[ $form_id ] ) && $is_ajax_enabled;
	}

}

# Configuration

new GW_Checkbox_Count( array(
	'form_id'            => 123, // the ID of your form
	'count_field_id'     => 2, // any Number field on your form in which the number of checked checkboxes should be dynamically populated; you can configure conditional logic based on the value of this field.
	'checkbox_field_ids' => array( 5, 8 ) // any array of Checkbox field IDs which should be counted
) );

@drmzeeshan I wish I could provide pro bono support but my plate is full! If you're a Gravity Perks customer, we'll be happy to take a look via support.

@drmzeeshan I wish I could provide pro bono support but my plate is full! If you're a Gravity Perks customer, we'll be happy to take a look via support.

Thank you for what you have already provided.
Just one thing. May you please point me towards some documentation which can address this issue. Some relevant material to read.
I will then try my best to understand it and solve this issue. I really need to sort this issue out.
Thanks

@drmzeeshan I don't have a great resource to direct you to that is specific to this use-case; however, you might consider posting on the Gravity Forms Community Forum: https://community.gravityforms.com/

Hello David @spivurno
After spending tons of hours finally I figured it out.
Its JQuery syntax. I learned the language from youtube tutorials. (Not completely of course but enough to understand the basic concepts).
Then inside your method:
self.updateCheckboxCount = function( formId, checkboxFieldIds, countFieldId )
and inside the If clause: if( parseInt( countField.val() ) != parseInt( count ) )
I added this simple piece of code:
$( "#input_3_1" ).val( count ).change();
Hard coded the form id and field id. LOL. But it worked.

thank you so much for your basic code otherwise of course I couldn't have created it on my own.

Just one last question, if you may pleas reply:
Is it possible to target some other webpage element like this? I mean anything to target other than gravityform elements. I am now thinking to target populate a simple html text field. (It makes it lot easy to customize the look and feel of simple html elements. For me setting up looks and griding of gravity form is very hard).

Thanks

@drmzeeshan Just update this bit to target any element on the page. jQuery is not limited to Gravity Forms. It can access any element. 🙂

$( "#any_element_id" ).val( count ).change();

Hi, thanks so much for this useful code, how can this be adapted to count the number of selections made in a gravity form multi-select?

@mrhat7865 You'd need to update line 90 to target options instead of inputs and then if they're selected rather than checked.

We'd be happy to assist with this if you're a Pro Gravity Perks license-holder: http://gravitywiz.com/

How do you use it? I'm not sure.

I think I'm following all the steps but I don't know how to report the value

Thank you

@lavelldesign Make sure you're setting the count_field_id to a field on your form. If you need more assistance, we do offer support for our snippets to our Gravity Perks customers (Pro and Advanced).

http://gravitywiz.com/support/

@spivurno. FANTASTIC!!!!!!!!

Amazing thank you so much for sharing this

Our pleasure, @Amir-Tayabali!