To change choices depending on what an user selected in another input/select, you need to use the WP AJAX API.
In your functions.php, use wp_localize_script() to get AJAX url available on front-end and define an AJAX action callback
function mytheme_custom_scripts() {
if ( is_page('Support') ) {
$scriptSrc = get_stylesheet_directory_uri() . '/js/freshdeskdata.js';
wp_enqueue_script( 'myhandle', $scriptSrc , array(), '1.0', false );
wp_localize_script( 'myhandle', 'mydata', array( 'ajaxurl' => admin_url('admin-ajax.php') ) );
}
}
add_action( 'wp_enqueue_scripts', 'mytheme_custom_scripts' );
function get_choices() {
$main_category = $_POST['main_category'];
$choices = []; // todo: get choices here
wp_send_json_success($choices); // send data with success code and die
}
add_action('wp_ajax_get_choices', 'get_choices'); //back-end
add_action('wp_ajax_nopriv_get_choices', 'get_choices'); //front-end
Then in your script make an AJAX call to get the choices
jQuery(function ($) {
$(document).ready(function() {
$("#main-category").on('change', function() {
$.post(mydata.ajaxurl, { // mydata has been created by the wp_localize_script function
action: 'get_choices',
main_category: $("#main-category").val()
}, function (response) {
console.log(response)
// todo: display new choices
})
});
});
});