在laravel中使用ajax發布數據時出現問題

Question

我正在嘗試使用ajax和jquery發布數據，但是當我使用post方法時卻出現了問題，我在url中得到的結果與get方法相同，為什么會這樣。 並擊中控制器方法后，對象應返回on cansole，但不是

視圖

 <div class="box-body">
                <form role="form">

                    <!-- select -->
                    <div class="form-group">
                        <label>Select</label>
                        <select class="form-control">
                            <option>option 1</option>
                            <option>option 2</option>
                            <option>option 3</option>
                            <option>option 4</option>
                            <option>option 5</option>
                        </select>
                    </div>
                    <!-- input states -->
                    <div class="form-group has-success">
                        <label class="control-label" for="inputSuccess"><i class="fa fa-check"></i> Input with
                            success</label>
                        <input type="text" class="form-control" id="name" name="name" placeholder="Enter ...">
                        <span class="help-block">Help block with success</span>
                    </div>

                    <div class="box-footer">
                        <button type="submit" class="btn btn-info pull-right" id="addMenu">Add Menu</button>
                    </div>
                </form>
            </div>

腳本

 <script>
        $(document).ready(function () {

            $('.ourItem').each(function () {
                $(this).click(function (event) {

                    var text = $(this).text();
                    $('#inputSuccess').val(text);
                    $('#delete').show(400);
                    $('#saveChanges').show(400);

                    // console.log(text);
                });

            });

            $('#addMenu').click(function (event) {

              var text = $('#name').val();
              $.post("menu.store", {'text':text}, function(data) {

                   console.log(data);
            });
                });

        });
    </script>

路線

Route::resource('/menu','NavegationController'); 

控制者

   public function store(Request $request)
    {

        return $values = $request->input();

    }

它應該返回對象，但在瀏覽器的console window中返回url

它返回什么

Navigated to http://localhost:8080/beautyproductswebapp/Public/?name=rgerge

rgerge是我輸入的值， name是輸入字段的name

Answer 1

您在控制台中看到的內容幾乎肯定不是來自您的Ajax請求。

您的“ addMenu”按鈕是“提交”類型的按鈕（根據您的HTML）。 當您單擊此按鈕時，它將使用正常的整頁刷新自動提交您的表單。 這種可能性很可能在您的ajax請求甚至開始之前，當然也可能在它完成之前發生。 即使完成，由於表單提交引起的頁面刷新，結果也會立即消失。

控制台中顯示的行是使用GET進行標准表單提交的結果（當您未在<form>標記中指定“ action”或“ method”參數時會發生這種情況）-它再次請求相同的基本URL ，您的表單變量將成為附加到URL的querystring參數。

為防止這種情況，您可以

a）將按鈕更改為具有type="button"屬性（而不是type="submit"

要么

b）放入event.preventDefault(); 作為$('#addMenu').click(function (event) {事件處理函數的第一行。它運行一個JS方法，該方法阻止元素的默認“ click”動作（在這種情況下為回發）。

這是您直接遇到問題的原因。 如評論中所述，您使用ajax請求的方式可能還會遇到一些其他問題。

Answer 2

好吧，您的ajax稱它為怪異的，顯然是錯誤的：

$.post('/menu', function(data) {

       console.log(data);
});

然后響應也是錯誤的，由於對象是ajax調用，因此您希望將對象轉換為json，如下所示：

public function store(Request $request)
{

    .... perform the queries or operations that you want to perform.

    if($request->wantsJson(){

        //Laravel automatically will cast the response to json 

      return response(['status'=>'ok'], 200);
    }   
   return ..view 
}