Skip to content

Instantly share code, notes, and snippets.

@tnorthcutt
Created January 25, 2012 17:42
Show Gist options
  • Save tnorthcutt/1677531 to your computer and use it in GitHub Desktop.
Save tnorthcutt/1677531 to your computer and use it in GitHub Desktop.
Autofill a set of fields (in a gravity form, in this case) based on a checkbox being checked.
jQuery(document).ready(function($) {
$('input#choice_13_1').click(function() {
if($(this).is(':checked')) {
$('#input_2_12_1').val($('#input_2_2_1').val());
$('#input_2_12_2').val($('#input_2_2_2').val());
$('#input_2_12_3').val($('#input_2_2_3').val());
$('#input_2_12_4').val($('#input_2_2_4').val());
$('#input_2_12_5').val($('#input_2_2_5').val());
};
});
});
@tareqhi
Copy link

tareqhi commented Sep 20, 2014

hi, tnorthcutt & Gary Jones, Thanks for this awesome tweak. Basically i am looking for this code since long time. But the problem praised here is- how to implement this code in my form? Should i copy the code to my theme's function.php file? or some other way?
Please provide the information to use the code.

@niz-yar
Copy link

niz-yar commented Feb 26, 2015

Has anyone got this working?

@saltmktg
Copy link

Works well here. Thanks a lot.

@schiem
Copy link

schiem commented Dec 28, 2015

For anyone still wondering, this needs to go in a javascript file that gets enqueued in functions.php, as here, and should be placed in document.ready(). Another way to do it more generally is the following:

function bindGformHandlers() {
    //bind the click function
    $(document).on('click', '.fill-check input', function() {
        if($(this).is(':checked')) {

            //put in the selectors we fill from
            var fill_from = $('.fill-from, .fill-from .name_last, .fill-from .name_first');
            fill_from.each(function() {

                //get the label
                label = $(this).find('label').text();
                //get the value
                value = $(this).find('input').val();

                //attempt to fill the new field with the value
                to_fill = $('.to-fill label:contains("' + label + '")').siblings().find('input').val(value);
                if(to_fill.length < 1) {
                    //this is so name fields will work
                    to_fill = $('.to-fill label:contains("' + label + '")').siblings('input').val(value);
                }   

            }); 
        }   
    }); 
}

Then all you need to do is create a checkbox with the CSS class "fill-check," give the fields you want to fill from the class "fill-from," and give the fields you want to fill into the class "to-fill" (classes can be added under the "appearance" tab on forms). As long as the labels for the fields are the same, it should work.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment