In FXML Controller, fxml fields are null, only the action responds

Question

In my controller class for my selection_bar.fxml, my controller deemed that the fxml field are null, I looked through many examples and other similar question but none seem applicable to my situation. I would very much like some help. Thank you!

Referencing to the "Passing Data to FXML", I implemented my code as follow

Controller

public class SelectionBarController {
   @FXML
    private Button home_btn;
    @FXML
    private Button patient_btn;
    @FXML
    private Button setting_btn;

    private MainView mainView;
    private UserModel viewModel;

    public void initSelectionBarController(MainView mainView, UserModel viewModel) {
        this.mainView = mainView;
        this.viewModel = viewModel;
        if (home_btn == null && patient_btn == null && setting_btn == null) {
            System.out.println("fxml field values are null");
        }
    }

    public void switchHomePage(Event e) {
        System.out.println("switchHomePage clicked");
    }

    public void switchPatientPage(Event e) {
        System.out.println("switchPatientPage clicked");
    }
}

Caller

public class MainView {
    private final Stage stage;
    private final BorderPane root;
    private final UserModel viewModel;
    private ToolBar selectionBar;
    private SelectionBarController selectionBarController;
    private PatientPageController patientPageController;
    private AnchorPane homePage;
    private BorderPane patientPage;
    //    private
    //Size of the window
    private static final double WINDOW_X = 800;
    private static final double WINDOW_Y = 600;

    public MainView(Stage stage, UserModel viewModel) {
        this.stage = stage;
        this.viewModel = viewModel;
        root = new BorderPane();
        stage.show();
        initializeUserInterface();
    }
public void initializeUserInterface() {
        drawBackground();
        drawToolBar();
        stage.show();
    }

    public void drawBackground() {
        Scene scene = new Scene(root, WINDOW_X, WINDOW_Y);
        stage.setScene(scene);
    }

    public void drawToolBar() {
        try {
            // linking fxml to controller
            FXMLLoader loader = new FXMLLoader(getClass().getResource("/view/selection_bar.fxml"));
            selectionBar = loader.load();
            selectionBarController = loader.<SelectionBarController>getController();
            selectionBarController.initSelectionBarController(this, viewModel);
        } catch (IOException io) {
            System.out.println("selection bar not loaded");
        }
        root.setTop(selectionBar);
    }
}

FXML

```<ToolBar prefHeight="30.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/18" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.java.clinic.controller.SelectionBarController">
    <items>
        <Button id="home_btn" mnemonicParsing="false" style="-fx-background-color: transparent;" text="Home"
                onAction="#switchHomePage">
            <opaqueInsets>
                <Insets/>
            </opaqueInsets>
        </Button>
        <Button id="patient_btn" mnemonicParsing="false" style="-fx-background-color: transparent;" text="Patient"
                onAction="#switchPatientPage">
            <opaqueInsets>
                <Insets/>
            </opaqueInsets>
        </Button>
        <Button id="setting_btn" mnemonicParsing="false" style="-fx-background-color: transparent;" text="Settings"
                onAction="#switchSettingPage">
            <opaqueInsets>
                <Insets/>
            </opaqueInsets>
        </Button>
    </items>
</ToolBar>

Result on Intellij

fxml field values are null