Избавиться от нажатия на кнопку js Asp.Net Core

129

29 июля 2019, 21:00

Есть вот такой код!

Выберешь в выпадающем списке офис и нажимаешь кнопку и он переходит на выбранный офис.

<form>
    <div class="form-group" id="catSelect">
        <select onchange="onChangeFunc()" name="officeId" class="target form-control" id="onChangeText" asp-items="ViewBag.Offices"></select>
    </div>
    <button id="officeButton" class="hidden" style="margin-bottom: 20px">Get</button>
</form>

А, нужно сделать что бы при выборе в выпадающем списке страница менялась без нажатия на кнопку.

Нужно избавиться от этой строчки

var button = document.getElementById('officeButton').click();

То есть была кнопка

<button id="officeButton" style="margin-bottom: 20px">Get</button>

из формы. Я её сделал невидимой

<button id="officeButton" class="hidden" style="margin-bottom: 20px">Get</button>

,а в скрипте она нажимается. Нужно что бы работало без этой строчки!

Вот скрипт:

<script>
                    var selectText = document.getElementById("onChangeText");
                    var selectedText = selectText.options[selectText.selectedIndex].text;
                    document.getElementById("officeName").innerHTML = selectedText;
                </script>
                <script>
                    function onChangeFunc() {
                        var val = document.getElementById('onChangeText').value;
                        $.ajax({
                            type: 'GET',
                            url: '@Url.Action("Index", "Offices")',
                            data: { officeId: val },
                            dataType: 'json',
                            success: console.log('ok')
                        });
                        var button = document.getElementById('officeButton').click();
                    }
</script>

Не могу победить. Как убрать костыль.

Answer 1

function onChangeFunc() {
  $.ajax({
    type: 'GET',
    url: '@Url.Action("Index", "Offices")',
    data: { officeId: $("#onChangeText").val() },
    success: function(data) { 
      console.log('ok'); 
      $("#onChangeText").closest("form").submit();
    }
  });
}