onchange ajax get not work on form метод post

я пытаюсь сделать onChange событие на моей форме . onChange использовать событие ajax get. но это не вернет значение.

вот мой заголовок актив

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

вот моя форма

<form action="/" method="post" >
    <select name="juz" onchange="juz(this.value)">
        <option value="">-- Pilih --</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
    <div id="keluar"></div>
</form>

а вот скрипт

<script type="text/javascript">
      function juz(val) {
        var hasilSurat = $("#keluar");
        $.ajax({
            url: "{{URL::asset('v1/juz')}}" + '/' + val,
            method: 'GET',
            dataType: 'json',
        }).done(function(data) {
            if (data.response == 1) {
                hasilSurat.val(data.result);
            } else {
                hasilSurat.val(data.result);
            }
        });
    }
</script>

и из журнала консоли

test:11 Uncaught TypeError: juz is not a function
at HTMLSelectElement.onchange

1 ответ

  1. изменить select nameна другое значение, отличное от juz

    <select name="juza" onchange="juz(this.value)">
    

    Внутри formтега мы не можем установить nameзначение свойства для onchangeимени функции обработчика событий.

    этот код будет работать, так как он не внутри form

    <select name="juz" onchange="juz(this.value)">
            <option value="">-- Pilih --</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
        </select>
    

    этот код не будет работать, так selectкак находится внутри формы,

    <form action="/" method="post" >
        <select name="juz" onchange="juz(this.value)">
            <option value="">-- Pilih --</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
        </select>
        <div id="keluar"></div>
    </form>
    

    Не уверен о причине, я попробую обновить его.