Select tag value dynamically changed based on main select tag

Question

I am having 2 Select drop-downs with 3 options each wrapped in a single component. (Refer Code below) When the page is loaded, "Quadrant 1" is the default Select optio