PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Dynamic Field Population Based on Dropdown value

  1. Is is there anyway to populate multiple fields using the example below? I know I can copy and paste the script every time I want to populate another field but I was hoping to be able to shorten the amount of code.

    Do you know of an easy way to add this functionality using the code below from Alex?

    Thanks!
    ------------------

    <?php
    add_filter("gform_pre_render_167", "monitor_dropdown");
    function monitor_dropdown($form){
    
    ?>
        <script type="text/javascript">
        jQuery(document).ready(function(){
    
            jQuery('#input_167_3').bind('change', function()
            {
                //get selected value from drop down;
                var selectedValue = jQuery("#input_167_3").val();
    
                //populate a text field with the selected drop down value
                jQuery("#input_167_1").val(selectedValue);
            });
        });
        </script>
    <?php
    
    return $form;
    }
    ?>
    Posted 12 years ago on Thursday August 25, 2011 | Permalink
  2. You can add as many field IDs as you want to the line that actually updates the value. For example, you could change this:

    [js]
    //populate a text field with the selected drop down value
    jQuery("#input_167_1").val(selectedValue);

    to this:

    [js]
    //populate a text field with the selected drop down value
    jQuery("#input_167_1, #input_167_2, #input_167_4").val(selectedValue);

    And it would update the value of all three fields.

    Posted 12 years ago on Thursday August 25, 2011 | Permalink
  3. I figured it would be something that easy, thank you!

    With my fields now populating dynamically, I wondering... Is it possible to use jQuery in a similar way to populate a dropdown menu based on values entered into a number of fields? I am using a multi-page form. I have found a similar topic in the forum but it wont quite work for us.

    Also, is there a way to add/subtract/mulitply/divide the value from an array of field values and then populate another field with the result?

    Thanks for the help with all this you guys are great!

    Posted 12 years ago on Thursday August 25, 2011 | Permalink
  4. You can add options to a drop down menu like so:

    [js]
    jQuery('#dropdown_id').append('<option value="option value">Option Name</option>');

    The option value and name can be determined by retrieving the value of whatever field you'd like to populate there.

    To calculate the total value of an array of values, you can do this:

    [js]
    var total = 0;
    $.each(arr,function() {
        total += this;
    });

    You can assign the total value just like you assign the value of the field in the original example.

    Posted 12 years ago on Thursday August 25, 2011 | Permalink
  5. Appreciate the quick replies!

    (clearly) I am not very experienced with JQuery/php but just to be clear so I understand correctly.
    would my updated code look something like this?

    <?php
    add_filter("gform_pre_render_167", "monitor_dropdown");
    function monitor_dropdown($form){
    
    ?>
        <script type="text/javascript">
        jQuery(document).ready(function(){
    
            jQuery('#input_167_3').bind('change', function()
            {
                //get selected value from drop down;
                var selectedValue = jQuery("#input_167_3").val();
    
                //populate a text field with the selected drop down value
                jQuery("#input_167_1").val(selectedValue);
    
                //add options to a drop down menu
                jQuery('#dropdown_470').append('<option value="option value">  #input_9_300, #input_9_301 , #input_9_302 , #input_9_303  </option>');
    
                //calculate the total value of an array of values
               var total = 0;
               $.each(arr,function("#input_167_1, #input_167_2, #input_167_4") {
                   total += this;
                   });
    
            });
        });
        </script>
    <?php
    
    return $form;
    }
    ?>

    Which part of the code allows you to define the field that will hold the outputted value?

    Thanks again, this will be great if we can add this functionality to our forms!
    Cheers

    Posted 12 years ago on Thursday August 25, 2011 | Permalink
  6. sascha
    Member

    Just wanted to keep up to date on this. I could not subscribe to this topic without leaving some text here....

    Posted 12 years ago on Friday August 26, 2011 | Permalink
  7. The total portion of the code should work more like this:

    [js]
    //calculate the total value of an array of values
                var total = 0;
                $('#input_167_1, #input_167_2, #input_167_4').each(function() {
                    total += $(this).val();
                });
    
                jQuery('#input_167_999').val(total); // update 999 to the field ID you wish to update the total for
    Posted 12 years ago on Friday August 26, 2011 | Permalink