首页 > 解决方案 > 此路由不支持 GET 方法。支持的方法:POST。在 Laravel 7.24.0

问题描述

我正在尝试使用 Ajax 提交表单数据,但收到错误消息。我找不到错误。

小提醒 - 我正在使用 Sweet Alert 来显示成功或错误消息

这是控制器代码 -

class NewUserRegnController extends Controller
{
    public function submitNewRegn(Request $request){
     
        $first_name         =   $request->first_name;
        $last_name          =   $request->last_name;
        $email              =   $request->email;
        $password           =   Hash::make($request->password, [
                                     'memory' => '1024',
                                     'time' =>  '2',
                                     'threar' =>  '2',
                                    ]);
        // $confirm_password    =   $request->confirm_password;
        $mobno              =   $request->mobno;
        $dob                =   $request->dob;
        $gender             =   $request->gender;
        $address            =   $request->address;
        $country            =   $request->country;
        date_default_timezone_set("Asia/Kolkata"); 
        $time               =   date("Y-m-d,H:i:s ");   

        // $users = new Newuser();

        // $users->first_name = $first_name; 
        // $users->last_name = $last_name; 
        // $users->email = $email; 
        // $users->password = $password; 
        // $users->mobno = $mobno; 
        // $users->dob = $dob; 
        // $users->gender = $gender; 
        // $users->address = $address; 
        // $users->country = $country; 
        // $users->TIME_STAMP = $time; 

        // $users->save();
        $act =  "INSERT";
        DB::select('CALL my_stored_procedures(?,?,?,?,?,?,?,?,?,?,?,?)', array($act,0,$first_name,$last_name,$email,$password,$mobno,$dob,$gender,$address,$country,$time));

和刀锋——

<!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.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">


    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgTPSdUtOBvfO8shuf57BaghqFfPlYxofvL8/KUEfYiJOMMV+rV" crossorigin="anonymous"></script>

    <!-- Ajax script -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>


    <!-- Sweet Alert -->
    <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>


    </head>
  <body>
    <!-- Navigation Bar --> 
   <div class="container-fluid">
  <div class="row">
    <div class="col">
      <nav class="navbar navbar-expand-sm bg-dark navbar-dark navbar-fixed-top">
  <a class="navbar-brand" href="index">User Info</a>
  <ul class="navbar-nav">
    <li class="nav-item active">
      <a class="nav-link" href="#">Home</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="#">Features</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="#">About Us</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="#">Contact Us</a>
    </li>

    
  </ul>
  <ul class="nav navbar-nav navbar-right ">
  <li class="nav-item"><a class="nav-link" href="new_user"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
      <li class="nav-item"><a class="nav-link" href="login"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
    </ul>

  
</nav>
    </div>
  </div>

 <div class="text-center pt-3">
<p style="color:red">For safety,Do Not hit the back button or refresh the page</p>
<p style="color:red">Use the buttons given in the form below</p>
</div>

<form class="form-group" id="new_user_form" method="post"  onsubmit="sendForm()" autocomplete="off">
 <div class="row  m-5 p-5 bg-warning text-white">
     <div class="col">
<div class="form-group">
  @csrf
 <label for="fname">First Name:</label>
  <input type="text" class="form-control" name="first_name" value="{{$first_name}}" readonly >
</div>
<div class="form-group">
 <label for="lname">Last Name:</label>
  <input type="text" class="form-control" name="last_name" value="{{$last_name}}" readonly>
</div>
<div class="form-group">
 <label for="email">Email/Username:</label>
  <input type="text" class="form-control" name="email" value="{{$email}}" readonly>
</div>
<div class="form-group">
  <label for="pwd">Password:</label>
  <input type="password" class="form-control" name="password"  value="{{$password}}" readonly>
</div>

  <div class="form-group">
 <label for="mobno">Mobile Number:</label>
  <input type="text" class="form-control" name="mobno" value="{{$mobno}}" readonly>
</div>
<div class="form-group">
 <label for="dob">Date of Birth(in YYYY-MM-DD):</label>
  <input type="text" class="form-control" name="dob" value="{{$dob}}" readonly>
</div>

<div class="form-group">
  <label for="gender">Gender:</label>
   <input type="text" class="form-control" name="gender" value="{{$gender}}" readonly>

 </div>
  <div class="form-group">
  <label for="address">Address:</label>
  <textarea class="form-control" rows="5" name="address"  readonly>{{$address}}</textarea>
</div>

<div class="form-group">
<label for="country">Country:</label>
 <input name="country" class="form-control" id="countrylist" value="{{$country}}" readonly>
</div>

 <div class="form-group">
 <label for="dt">Date and Time of Submission:</label>
  <input type="text" class="form-control" name="dt" value=@php date_default_timezone_set("Asia/Kolkata"); echo date("Y-m-d,H:i:s ") @endphp readonly>
</div>
<div class="form-group text-center">
<!-- <a href="{{url('recheck_form')}}"/><button type="submit" class="btn btn-primary mb-2 text-center" onclick="store_using_ajax()">Submit</button> -->
<input type="submit" class="btn btn-primary mb-2 text-center" id="submit_form">
</div>
<div class="form-group text-center ">
<button type="button" class="btn btn-danger"><a href="new_user">Cancel</a></button>
<button type="button" class="btn btn-warning "><a href="">Edit</a></button>
</div>

</div>

</div>



</div>   
 


<script>
   $(document).ready(function(){
     $('#new_user_form').on('submit',function sendForm(e){
       e.preventDefault();
     var fd = new FormData(myform );
      var form_data = $(this);
    
     $.ajax({
       type:'POST',
       url: "submit-form" ,
       cache: false,
       processData: false,
         contentType: false,
       data:fd,

        data: $('#new_user_form').serialize(),

       success:function(response){
            swal({
         title: "Form Submitted Successfully!",
         text: "New User Registered !",
         icon: "success",
         button: "Okay",
       })

       },
       error: function(response){
       swal({
             title: "Error in submitting form",
             text: "Please refresh the page and try again! ",
             icon: "warning",
            button: "Okay",
            });
            
             }
  });

   });
     });

 </script>

路线 -


Route::get('login','LoginController@loginuser');
Route::post('loggedinuser' , 'LoginController@loginvalidator' );
    


Route::get('new_user','NewUserController@getCountry');

Route::post('recheck-form', 'NewUserController@showdata');
Route::get('loginbackup',function(){
    return view('login-backup');

});


Route::post('submit-form' , 'NewUserRegnController@submitNewRegn');

我尝试更改控制器和函数名称,但这没有帮助。此外,删除 cookie 和清除浏览器历史记录也不起作用。

标签: phpjqueryajaxlaravel

解决方案


首先,我忘了添加一些关闭的 html 标记。完成后,我需要在 ajax 脚本和元标记中添加 CSRF 令牌。 我用以前犯的所有错误重新编辑了这个问题,以显示我做错的地方。

以下是要添加的代码:-

关闭 HTML 标签

</form> </body> </html>

元标记

<meta name="csrf-token" content="{{ csrf_token() }}">

Ajax 脚本中的 Ajax 请求标头设置

   $.ajaxSetup({
      headers: {
          'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
      }
  }); 

推荐阅读