There's a number of way to do the thing you're asking.
If your php function just spits out an array of options, you could consider adding the array to your site's footer with wp_localize_script() and then get the data out of by referencing the js object in your script. E.g.
// theme functions.php or a plugin file
function dropdown_options() {
// modify to match your setup
wp_enqueue_script( 'my-scripts', JS_DIR_URI . 'my-scripts.js', array('jquery'), null, true ); // main scripts file
wp_localize_script( 'my-scripts', 'dropdownOptions', $array_of_dropdown_options );
}
add_action( 'wp_enqueue_scripts', 'dropdown_options' );
// in your js file, access dropdown options
dropdownOptions.someOption;
Another option would be to use the WP admin ajax to get the dropdown options whenever the dropdown selection changes. E.g.
// theme functions.php or a plugin file
function data_from_admin_ajax() {
wp_enqueue_script( 'frontend-ajax', JS_DIR_URI . 'frontend-ajax.js', array('jquery'), null, true );
wp_localize_script( 'frontend-ajax', 'frontend_ajax_object',
array(
'ajaxurl' => admin_url( 'admin-ajax.php' ),
)
);
}
add_action( 'wp_enqueue_scripts', 'data_from_admin_ajax' );
add_action( 'wp_ajax_dropdown_options', 'my_awesome_dropdown_options_function' ); // logged in users
add_action( 'wp_ajax_nopriv_dropdown_options', 'my_awesome_dropdown_options_function' ); // logged out users
function my_awesome_dropdown_options_function() {
// nonce check, if needed
// capabilities check, if needed
// check for required parameter, if needed
// do stuff and push data to $response
// return ajax response with wp_send_json( $response ) or wp_send_json_success( $response ) or wp_send_json_error( $response )
}
// frontend-ajax.js
jQuery(document).ready(function($) {
$('.some-dropdown').on('change',function(){
var data = {
'action': 'dropdown_options',
'dropdownValue': $(this).val()
};
$.post(frontend_ajax_object.ajaxurl, data, function(response) {
console.log(response);
});
});
});
Or if you want, you could use the WP REST API instead of the admin ajax. In this case you probably need to add a custom endpoint, https://developer.wordpress.org/rest-api/extending-the-rest-api/adding-custom-endpoints/
