Question

我必须使用POST传递表单数据（将其转换为JSON格式），在Laravel中利用Javascript和Ajax。

基本上，表单中的数据必须成为一个json，以便将它（使用POST）传递给Controller类，并使用能够使用数据的方法。我有一个引导形式：

 <form id="contactForm" action="#" method="post">
<div class="form-group">
    <label for="exampleInputEmail1">Email address</label>
    <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
    <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>
</div>
<div class="form-group">
    <label for="exampleInputPassword1">Password</label>
    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
</div>

<div class="form-group">
    <label for="exampleTextarea">Example textarea</label>
    <textarea class="form-control" id="exampleTextarea" rows="3"></textarea>
</div>

<button type="submit" class="btn btn-primary">Submit</button>
</form>

现在，要传递使用JSON转换它的数据：

 <script>
 var $contactForm = $('#contactForm');
 $contactForm.submit(function(e) {
 e.preventDefault();
 $.ajax({
    url: './getContact',
    method: 'POST',
    data: $(this).serialize(),
    dataType: 'json',
success:success: function(data)
{

}
});
});
</script>

利用Laravel routes.php

Route::post('./getContact', 'Controller@tryIt');

这是使用此服务的正确方法吗？（这是由于我不能使用数据表格，如POST没有提供任何成功）。

你能帮帮我吗？

提前致谢

Answer 1

首先，您需要添加csrf令牌也试试这种方式。

HTML

<form id="contactForm" action="#" method="post">
{!! csrf_field() !!}
<div class="form-group">
    <label for="exampleInputEmail1">Email address</label>
    <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
    <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>
</div>
<div class="form-group">
    <label for="exampleInputPassword1">Password</label>
    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
</div>

<div class="form-group">
    <label for="exampleTextarea">Example textarea</label>
    <textarea class="form-control" id="exampleTextarea" rows="3"></textarea>
</div>

<button type="submit" class="btn btn-primary">Submit</button>
</form>

<强> JS

     <script>
   $(document).ready(function() {
       $(document).on('contactForm', '#reg-form', function(e) {
        var data = $("#reg-form").serialize();
        e.preventDefault();
           $.ajax({
               type: 'POST',
               url: '{{url("/getContact")}}',
               data: data,
               success: function(data) {
                alert("success");
                console.log(data);

               },
               error: function(data) {
                   alert("error");
               }
           });
           return false;
       });
   });
   </script>

路线

Route::post('/getContact', 'Controller@tryIt');

在tryit方法中你应该返回json响应

public function tryit(Request $request){

//logic here

return response()->json("success");

}

使用javascript和Ajax POST形成JSON [LARAVEL]

1 个答案: