尝试提交我的Laravel表单而不刷新页面

时间:2018-11-16 16:50:51

标签: ajax laravel

我正在尝试提交表单,而无需刷新页面。我没有成功,但在控制台日志中不断收到错误消息,提示服务员说页面有错误。我不知道我在做什么错。有谁可以帮助我吗?我正在使用laravel,ajax。这是我的代码。预先感谢

   //Ajax

$('.formform' ).submit(
    function( e ) {
        $.ajax( {
            url: '{{ url('profileupdate') }}',
            type: 'POST',
            data: new FormData( this ),
            processData: false,
            contentType: false,
            success: function(result){
                console.log(result);
            }
        } );
        e.preventDefault();
    } 
);


             //The form
    {!!Form::open(['url'=>['profileupdate',Auth::user()->id],'method'=>'POST','files'=>true,'class'=>'formform formform2','enctype' => 'multipart/form-data']) !!}

                    <div style="position:relative; left:.5em; font-size:1.3em;">
ADD YOUR VIDEO!<br>

                        </div>
                        <br>
                    {{Form::file('video',array('id'=>'file','class'=>'thefile'))}}

                    <label for="file"  class="btn btn-default" style="background:none;">Choose a file</label> <span class="tt"></span>








                    {{Form::text('Company','',array('placeholder'=>'Company Name','class'=>'form-control'))}}

{{Form::text('city','',array('placeholder'=>'City and State','class'=>'form-control', 'size'=>'35px','height'=>'15px','id'=>'location-input','autocomplete'=>'off'))}}

{{Form::text('zip_code','',array('placeholder'=>'Zip Code','class'=>'form-control'))}}

 {{Form::text('Phone_Number','',array('placeholder'=>'Phone Number','class'=>'form-control'))}}



{{Form::submit('Submit', array('class'=>'btn btn-warning form-control','id'=>'submitty profile1_submit','style'=>'border:none; margin-top:3%; margin-bottom:5%;', 'data-toggle'=>"modal",  'data-target'=>"#profile_modal"))}}
{!!Form::close() !!}

   //Here is the route

   Route::post('profileupdate/{id}','Profile1Controller@update');

3 个答案:

答案 0 :(得分:1)

您错过了参数id'profileupdate / {id}' 更改此:

url: '{{ url('profileupdate') }}',

使用

 url: {!! route('profileupdate', ['id' => Auth::user()->id  ]) !!}

不要忘记在数据中添加csrf的令牌(javascript部分)

    "_token": $('#token').val()

答案 1 :(得分:1)

更新需要和令牌(如果已发布)。我也认为您呼叫路线的方式是错误的。 我在这里的代码中所做的是我使用id作为参数调用一个函数,并使用按钮调用它:

<button type="button" onclick = "submitThisForm({{Auth::user()->id}})"> Submit</button>

然后脚本函数包含ajax帖子。我使用replace将ID添加到路由。

 function submitThisForm(id){
    url= '{{route('upload-employee-request',[":emp"])}}';
    url= url.replace(':emp', id);

}

然后终于

function submitThisForm(id){
        url= '{{route('upload-employee-request',[":emp"])}}';
        url= url.replace(':emp', id);

        $.ajax( {
            url: url,
            type: 'POST',
            data: new FormData( this ),
            processData: false,
            contentType: false,
            success: function(result){
                console.log(result);
            }
        } );
        e.preventDefault();


    }

希望有帮助!

答案 2 :(得分:0)

多亏了Abderrahim Soubai Elidrissi和Dearwolves(谢谢大家),我才得以工作

这对我有用

 $.ajaxSetup({

        headers: {

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

        }

    });


$('.formform' ).submit(
    function( e ) {
        $.ajax( {
            url: '{!! url('profileupdate', ['id' => Auth::user()->id  ]) !!}',
            type: 'POST',
            data: new FormData( this ),
            processData: false,
            contentType: false,
            success: function(result){
                alert('form submitted');
            }
        } );
        e.preventDefault();
    } 
);