JQuery сообщение в службу REST

Question

Я посмотрел на кучу разных Q / A в стеке, и я не могу решить мою проблему, почему мой интерфейс покоя не вызывается при нажатии кнопки submit. Я был бы признателен, если бы вы, ребята, могли посмотреть и понять, где может быть проблема.

Цель состоит в том, чтобы иметь входные значения формы (сейчас они жестко запрограммированы до тех пор, пока я не заставлю их работать) и отправить изменения базы данных, в которой они находятся, с помощью вызова REST.

РЕДАКТИРОВАТЬ: при нажатии кнопки, нет ошибок в консоли, ничего не отображается в БД.

<?php 

    $id = "123456";
    $auth = "XYZ123"; //this will change daily
    $url = "http://update/this/id/$id"; //this will change based on user

?>

<script >
    const URL = <?php echo json_encode($url);?>;
    const auth = <?php echo json_encode($auth);?>;
    const data = {
        "flag":"Y" //in the database flag has a value of N want to change to Y
    }

    $.ajaxSetup({
        headers: {
            'auth-key': '${auth}',
            'api-version': '1.0',
            'Content-Type': 'application/json',
            'Accepts': 'application/json',
            'Verbosity' : '4'
        }
    });
    $('.btn').click(function(){
        $.post(URL, data, function(data, status){
            console.log('${data} and status is ${status}')
        });
    })
</script>

<button type="submit" class="btn">Send it!</button>

Answer 1

JavaScript выполняется до загрузки DOM (теги <script> прерывают анализатор DOM). К моменту выполнения скрипта элемент .btn еще не существует.

Либо

• переместить скрипт в конец тела (или хотя бы после кнопки отправки),
• или добавьте прослушиватель событий после загрузки DOM ,

• или используйте глобальный прослушиватель событий

  $(document).on('click', '.btn', function() { ... }