Add data-attributes to select options


I’m trying to pre-populate a dropdown field with data from MySQL.

add_filter( 'gform_pre_render_1') etc works to add the data and the form works ok, but I’m trying to add data-id and other attributes at the same time, but choices only take text and value.

I tried adding something like the below; I can see that field becomes populated with the required data in the admin and the front end, but the data doesn’t save when going through the form. Am I missing a step? or is there a way to add data attributes more efficiently? Thanks

//Custom Form Elements for  Selection
add_filter("gform_field_input_1", "course_dates", 10, 5);
function course_dates( $input, $field, $value, $lead_id, $form_id ) {
  if ( $field["cssClass"] == "course_dates" ) {
	$input = '<select name="input_76" id="input_1_76" class="large gfield_select" aria-invalid="false">';
	$input .= '<option value="0">Select Course Date</option>';
	foreach($courseDates as $course){
		$input .= '<option value="'.$course->course_id .'" data-id="'. $course->course_id .'" data-coursedate="'. $startDate .'" data-courselength="'. $course->course_length .'">'. $selectText .'</option>';
	$input .= '</select>';
    return $input;

gform_field_choice_markup_pre_render is the recommended filter for modifying choice markup. See the following page of the documentation for usage examples: