阿賈克斯發佈請求不通過表格的數據

Question

我有這個觀點，我有一些divs :(我玩阿賈克斯做皮/拍攝，淡入淡出看到我需要的每一個時刻的信息

@extends('cms.public.layouts.default') 
@section('content') 

<div class="col-md-10"> 
    <h3 style="letter-spacing:40px;text-align:center;color:f15d5e;">PROYECTOS</h3> 
</div> 

<div id="listall"> <!-- DIV TO LIST ALL THE PROJECTS START HERE --> 
     <div class="col-md-2" style="padding:20px;"> 
      <button type="button" id="buttoncreate" class="btn btn-danger">Crear Proyecto</button> 

     </div> 
         <table class="table"> 
        <thead style="color:white"> 
        <tr> 
         <th>Id</th> 
         <th>Slug</th> 
         <th>Order</th> 
         <th>Public</th> 
         <th>Path header</th> 
         <th>Path home</th> 
         <th>Fecha creación</th> 
         <th>Fecha ultima actualización</th> 
         <th><span class="glyphicon glyphicon-cog"></span></th> 
        </tr> 
        </thead> 
        <tbody style="color:white"> 
        @foreach ($projects as $key => $project) 
        <tr> 
         <th>{{$project->id}}</th> 
         <td>{{$project->slug}}</td> 
         <td>{{$project->order}}</td> 
         <td>{{$project->public}}</td> 
         <td>{{$project->pathheader}}</td> 
         <td>{{$project->pathhome}}</td> 
         <td>{{ date('M j, Y', strtotime($project->created_at))}}</td> 
         <td>{{ date('M j, Y', strtotime($project->updated_at))}}</td> 
         <td><a href="{{ route('admin.projects.show', $project->id)}}" class="btn btn-info btn-sm">View</a> <a href="{{ route('admin.project.edit', $project->id)}}" class="btn btn-success btn-sm">Edit</a> 
        @endforeach 
        </tr> 
        </tbody> 
       </table> 
    <br><br> 
</div> <!-- DIV TO LIST ALL THE PROJECTS END HERE --> 

<div id="form1" style="display:none;" class="col-md-8"> <!-- DIV TO SHOW THE CREATE PROJECT FORM 1 START HERE--> 
    <div> 
    <h3>Crear nuevo proyecto</h3> 
    </div> 



    <div id="formcreateproject"> 
     <form method="POST" action="{{ route('admin.projects.store') }}" enctype="multipart/form-data" id="myForm" name="myForm"> 
     {{ csrf_field() }} 
      <div class="form-group"> 
      <label name="title">Slug:</label> 
      <input type="text" id="slug" name="slug" placeholder="ejemplo-de-slug" class="form-control form-control-sm"> 
      <label name="order">Order:</label> 
      <input type="number" id="order" name="order" class="form-control form-control-sm"> 
      <label name="public">Public:</label> 
      <input type="number" id="public" name="public" class="form-control form-control-sm"> 
      <label name="body">Header</label> 
      <input type="file" name="pathheader" id="pathheader" class="form-control-file" aria-describedby="fileHelp"><br> 
      <label name="body">Home</label> 
      <input type="file" name="pathhome" id="pathhome" class="form-control-file" aria-describedby="fileHelp"><br> 

      <input type="submit" value="Crear Proyecto" id="createprojectsubmit" class="btn btn-danger btn-md"> 
      <input type="hidden" name="_token" value="{{ Session::token() }}"> 
      <br><br><br> 

      </div> 
     </form> 

     </div> 
</div> <!-- DIV TO SHOW THE CREATE PROJECT FORM 1 END HERE--> 

<div id="form2" style="display:none;" class="col-md-6"> 
<div class="col-md-"> 
    <h3>Crear nuevo proyecto</h3> 
    </div> 
     <form method="POST" action="{{ route('admin.projects.store') }}" enctype="multipart/form-data"> 
      <div class="form-group"> 
      <label name="title">Slug:</label> 
      <input type="text" id="slug" name="slug" placeholder="ejemplo-de-slug" class="form-control form-control-sm"> 
      <label name="order">Order:</label> 
      <input type="number" id="order" name="order" class="form-control form-control-sm"> 
      <label name="public">Public:</label> 
      <input type="number" id="public" name="public" class="form-control form-control-sm"> 
      <label name="body">Header</label> 
      <input type="file" name="pathheader" id="pathheader" class="form-control-file" aria-describedby="fileHelp"><br> 
      <label name="body">Home</label> 
      <input type="file" name="pathhome" id="pathhome" class="form-control-file" aria-describedby="fileHelp"><br> 

      <input type="submit" value="Crear Proyecto" id="createprojectsubmit" class="btn btn-danger btn-md"> 
      <input type="hidden" name="_token" value="{{ Session::token() }}"> 
      <br><br><br> 

      </div> 
     </form> 
</div> 

</div> 
@stop 

而有此javascript：（URL是正確的，而且也控制，如果我這樣做沒有Ajax它的工作原理）

$(document).ready(function(){ 
    $("#buttoncreate").click(function(){ 
     $("#listall").hide(); 
     $("#form1").fadeIn(1000); 
    }); 

    $("#createprojectsubmit").click(function(){ 
     $("#myForm").submit(); 
    }); 

    $("#myForm").submit(function(e){ 
     e.preventDefault(); 
     $.ajax({ 
      url:'/admin/projects/postUpload', 
      type:'post', 
      data:$('#myForm'), 
      success: function(){ 
       $("#form1").fadeOut(1000); 
       $("#form2").fadeIn(1000); 
      } 
     }); 
    }); 
}); 

所有的工作很好，但形式不工作。如果我檢查導航器的開發工具，myForm：沒有任何東西。如何傳遞所有數據？包含令牌？

所有幫助將不勝感激，非常感謝。

Answer 1

你需要序列化你通過AJAX傳遞的數據。現在，您只需傳遞表單的jQuery對象而不是其數據。

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

您可以在這裏這個功能找到文檔：http://api.jquery.com/serialize/

Answer 2

你逝去的整個形態爲研究對象，試試下面來代替。注意data

$("#myForm").submit(function(e){ 
    e.preventDefault(); 
    $.ajax({ 
     url:'/admin/projects/postUpload', 
     type:'post', 
     data:$('#myForm').serializeArray(), 
     success: function(){ 
      $("#form1").fadeOut(1000); 
      $("#form2").fadeIn(1000); 
     } 
    }); 
}); 

Answer 3

嘗試：

$.ajax({ 
      url:'/admin/projects/postUpload', 
      type:'post', 
      data:$('#myForm').serializeArray(), 
      success: function(){ 
       $("#form1").fadeOut(1000); 
       $("#form2").fadeIn(1000); 
      } 
     }); 

.serializeArray（）的jQuery對象轉換成鍵/值對的陣列，可以在後