0

Практикуюсь в AJAX запросах. С GET запросом всё вышло отлично, но вот при POST запросе просто обновляется страница, а в строку после домена добавляется: ?#

welcome.blade.php

    <!doctype html>
    <html lang="en">
    <head>
        <!-- Required meta tags -->
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

        <!-- Bootstrap CSS -->
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"
              integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
        <meta name="_token" content="{!! csrf_token() !!}">
        <title>Hello, world!</title>
    </head>
    <body>
    <h1>Hello, world!</h1>
    <hr>
    <div class="container">
        If u click - magic happend!
        <button type="button" id="getRequest">Get</button>
    </div>
    <hr>
    <form action="#" id="#postRequest" type="POST">
        <input type="text" id="name">
        <input type="text" id="surname">
        <input type="text" id="middlename">
        <button type="submit">Go</button>
    </form>
    <div class="postRequestData">

    </div>
    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"
            integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
            crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"
            integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6"
            crossorigin="anonymous"></script>
    <script>
        $(document).ready(function () {
            $.ajaxSetup({ headers: { 'X-CSRF-TOKEN': $('meta[name=_token]').attr('content') }});
            $('#getRequest').click(function () {
                $.get('getRequest', function (data) {
                    console.log(data);
                })
            })
            $('#postRequest').submit(function () {
                var name = $('#name').val();
                var surname = $('#surname').val();
                var midname = $('#middlename').val();
                $.post(
                        'postRequest',
                        { name:name, surname:surname, midname:midname },
                        function (data) {
                            console.log(data);
                            $('#postRequestData').html(data);
                        }
                );
            })
        })
    </script>
    </body>
    </html>

RequestController

    <?php

    namespace App\Http\Controllers;

    use Illuminate\Http\Request;
    use Response;

    class RequestController extends Controller
    {
        public function index()
        {
            return view('welcome');
        }
        public function get()
        {
            return Response::json('yeah');
        }
        public function post(Request $request)
        {
            if (Request::ajax()){
                return Response::json(Request::all());
            }
        }
    }

web.php

    <?php
    Route::get('/', 'RequestController@index');
    Route::get('/getRequest', 'RequestController@get');
    Route::post('/postRequest', 'RequestController@post');
2
  • method = 'POST'
    – Bloom
    24 фев 2020 в 9:17
  • 3
    т.е. вы пытаетесь навеится на сабмит формы, при этом у вас получается что форма отправляется и еще шлется xhr запрос. Вы бы хотя-бы в событии submit preventDeafault сделали чтобы дважды не слать.
    – binliz
    24 фев 2020 в 9:20

0

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Посмотрите другие вопросы с метками или задайте свой вопрос.