関係のないボタンが押されてしまう JavaScript Rails

railsにてアプリ開発中
現在地の所得ボタンを押すと、新規投稿ボタンがなぜか反応して、投稿してしまう問題を解決したい。

erb
1
2      <div class="center">
3        <div class="btn-margin">
4          <button id="get-position-btn" class="btn btn-outline-primary btn-lg">　#このボタンを押すとなぜか
5              現在位置を取得する
6          </button>
7        </div>
8        <div class="txt-margin">
9            <p>緯度：<span id="latitude">???</span><span>度</span></p>
10            <p>経度：<span id="longitude">???</span><span>度</span></p>
11        </div>
12      </div>
13      <%= javascript_pack_tag 'photo/new' %>
14    </div>
15
16
17    <div class='post-new-btn'>
18      <%= f.submit "投稿する" ,class: 'post-new' %> #このボタンが反応して投稿されてしまいます
19    </div>

<%= javascript_pack_tag 'photo/new' %>の中身↓

javascript
1// ボタンを押した時の処理
2document.getElementById("get-position-btn").onclick = function(){
3  // 位置情報を取得する
4  navigator.geolocation.getCurrentPosition(successCallback, errorCallback);
5};
6
7// 取得に成功した場合の処理
8function successCallback(position){
9  // 緯度を取得し画面に表示
10  var latitude = position.coords.latitude;
11  document.getElementById("latitude").innerHTML = latitude;
12  document.getElementById("latitude-form").value = latitude;
13  // 経度を取得し画面に表示
14  var longitude = position.coords.longitude;
15  document.getElementById("longitude").innerHTML = longitude;
16  document.getElementById("longitude-form").value = longitude;
17
18  var latlng = new google.maps.LatLng(latitude, longitude);
19
20  var marker = new google.maps.Marker({
21    map: map,
22    position: latlng
23  });
24
25  map.setCenter(latlng);
26};
27
28// 取得に失敗した場合の処理
29function errorCallback(error){
30  alert("位置情報が取得できませんでした");
31};
32
33(function() {
34  console.log("OK");
35});