leehericks/index.html

## index.html
<html>
  <body>
    <div data-controller="select-navigation">
      <select data-action="change->select-navigation#navigate">
        <option selected="selected" value="path/to/0">0</option>
        <option value="path/to/1">1</option>
        <option value="path/to/2">2</option>
      </select>
      <turbo-frame id="my_frame" data-select-navigation-target="frame"></turbo-frame>
    </div>
  </body>
</html>

## select_navigation_controller.js
import { Controller } from "stimulus"

export default class extends Controller {
  static get targets() {
    return ["frame"]
  }

  navigate(event) {
    let location = this.extract_location(event.target)
    event.target.blur()

    if (this.hasFrameTarget) {
      this.frameTarget.src = location
    }
    else {
      Turbo.visit(location)
    }
  }

  extract_location(select) {
    return select.options[select.selectedIndex].value
  }
}
	<html>
	<body>
	<div data-controller="select-navigation">
	<select data-action="change->select-navigation#navigate">
	<option selected="selected" value="path/to/0">0</option>
	<option value="path/to/1">1</option>
	<option value="path/to/2">2</option>
	</select>
	<turbo-frame id="my_frame" data-select-navigation-target="frame"></turbo-frame>
	</div>
	</body>
	</html>
	import { Controller } from "stimulus"

	export default class extends Controller {
	static get targets() {
	return ["frame"]
	}

	navigate(event) {
	let location = this.extract_location(event.target)
	event.target.blur()

	if (this.hasFrameTarget) {
	this.frameTarget.src = location
	}
	else {
	Turbo.visit(location)
	}
	}

	extract_location(select) {
	return select.options[select.selectedIndex].value
	}
	}