javascript - Ajax post request don't pass the data of the form -
i have view have divs: (i play ajax making hide/shot, fadein/fadeout see information need each moment.
@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 list 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 $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 list projects end here --> <div id="form1" style="display:none;" class="col-md-8"> <!-- div show 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 show 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 and have javascript: (the url correct, , controller too, if without ajax works).
$(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); } }); }); }); all working good, except form doesn't work. if check dev tools of navigator, myform: don't have anything. how pass data? included token?
all appreciated, lot.
you'll need serialize data pass via ajax. right now, you're passing in jquery object form rather data.
... data:$('#myform').serialize(), ...
you can find documentation on function here: http://api.jquery.com/serialize/
Comments
Post a Comment