dynamically populate fields based on drop down selection

Gravity Support Forums » Plugin Support » Gravity Forms

vixvii
Member

I am sure I've seen a post on this but I cannot seem to find it now.

How do I populate fields on a form based on the selection of a dropdown list? I have a list populated with the names of students. When a student is selected, I need to populate fields with the info related to that student. Is there a hook or function call I can use after a dropdown selection has been made?

Also, what will be the correct hook to use to execute code as the submit button is pressed? I would like to populate a hidden field with a unique ID based on the input and selections on the current form. So the code would have to execute before the values are written to the database.

Posted 12 years ago on Monday June 20, 2011 | Permalink
Carl Hancock
Administrator

You could only do this with custom jQuery. You'd have to write custom jQuery and attach it to the drop down field and then use jQuery to populate the fields with the data. There is no hook on drop downs because no PHP is triggered by a drop down so you have to do it using jQuery.

To execute code when the form is submitted you can use the gform_pre_submission hook or the gform_post_submission hook. Both will do the trick.

Pre Submission hook documentation is here:

http://www.gravityhelp.com/documentation/page/Gform_pre_submission

Post Submission hook documentation is here:

http://www.gravityhelp.com/documentation/page/Gform_post_submission

Posted 12 years ago on Monday June 20, 2011 | Permalink
vixvii
Member

Thanks again Carl! jQuery makes complete sense

Posted 12 years ago on Monday June 20, 2011 | Permalink
vixvii
Member
Any chance you could just get me started with jQuery? I understand the concept of jQuery, but I am taking it on as a new venture. I know where to put the code but I am not sure what the syntax is for communicating with a form and a field on the form? My current code looks like this :
```
add_filter("gform_pre_render_11", monitor_dropdown);
function monitor_dropdown($form){

?>
	<script type="text/javascript">
	jQuery(document).ready(function(){	

		jQuery('#input_3').bind('onchange', function ()
			{
			alert("test");
			});
	});
	</script>
<?php

return $form;
}
```
I think once I have the basics I will be able to figure out the rest.
Posted 12 years ago on Friday June 24, 2011 | Permalink

Try the following, making sure you replace 167 with your Form ID and 1 and 3 with your field IDs. jQuery has very good documentation online if you need any more help with it. http://jquery.com

<?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 Friday June 24, 2011 | Permalink

vixvii
Member

Thank you Alex! This is perfect and the jQuery documentation will get me further.

Posted 12 years ago on Friday June 24, 2011 | Permalink
tranzbi
Member

This is a great solution to my problem. However, I want to populate the second drop down with another list based on the previous drop down value. I can do this using ajax base on the previous drop down value I can query the database and return another drop down list, but I am not sure how to dynamically populate the list into the second drop down. Please help.

Posted 12 years ago on Tuesday June 28, 2011 | Permalink
vixvii
Member

Tranzbi - Have you sorted out the problem yet?

I can't give you a direct solution as I am "hacking" my way through it, but maybe this will help. I have the following in my functions.php file : http://www.pastie.org/2161836

And then this is the code of the test.php file : http://www.pastie.org/2161843

Hope it helps

Posted 12 years ago on Monday July 4, 2011 | Permalink
Mattbw11
Member

Hello Alex,
Thanks for your example code to populate a text field based on a drop-down selection.

I have followed your steps above, and replaced the form ID and field IS's with the correct ones from our form. For some reason I keep getting an error:
Parse error: syntax error, unexpected '<' in /home/content/58/7982758/html/wp-content/themes/twentyten/functions.php on line 518

Is there something Im not doing correctly to get this functioning properly?

I have added this code to the bottom of the functions.php file.

Posted 12 years ago on Wednesday August 24, 2011 | Permalink
Carl Hancock
Administrator

It looks like your code is wrong. You have a < where you shouldn't have one. Most likely because you have PHP tags when you've placed the PHP within an existing code block. If the code is already within a PHP tag and you try opening another you'll get this error.

Posted 12 years ago on Wednesday August 24, 2011 | Permalink
Mattbw11
Member

Thanks alot Carl! That fixed it...
Please excuse my lack of php/javascript knowledge. You guys have made modifying things really easy,. Its just a small learning curve and I will be good.

Posted 12 years ago on Wednesday August 24, 2011 | Permalink

This topic has been resolved and has been closed to new replies.