javascript - 想要使用 ajax 将事件状态从 1 更新为 0

Question

我将根据数据库中“事件”列值的状态启用或禁用按钮。我想使用 javascript 或 ajax 更改按钮状态。数据库中的 'active' 值也应该更新。

blade.php

                                 <td class="text-center">
                                     <a href="#" data-toggle="modal" data-target="#myModal" class="edit"><i class="fa fa-comment"></i></a>
                                     @if( $joins->active == "1")
                                         <a href="{{route('asset.status',$joins->id)}}" id="return" data-toggle="modal" @if($joins->active === "1") class="edit  action-button" @else class="disabled2" @endif><i class="fa fa-get-pocket"></i></a>
                                     {{--@else--}}
                                     {{--<a href="#" id="return" data-toggle="modal" class="disabled2"><i class="fa fa-get-pocket"></i></a>--}}

                                     @endif
                                 </td>

脚本

<script>
    $(".action-button").click(function(){
        swal({
            type : 'warning',
            title: 'Submit what you want',
            input: 'text',
            showCancelButton: false,
            confirmButtonText: 'Submit',
            showLoaderOnConfirm: true,
            allowOutsideClick: false

        }).$.ajax({
        type: "POST",
        url : 'profile-management/employee-assets/update/{id}',
        data: { id: id },
        success: function(data){
            swal('Confirmed!','success')
        }

        });
    })

</script>

web.php

Route::get('profile-management/employee-assets/update/{id}','AssetController@statusUpdate')->name('asset.status');

Controller.php

   public function statusUpdate(Request $request,$id){
        $update = Asset::find($id);
        $update->active = "1";

        $update->save();
        $request->session()->flash('alert-info', 'Product Status Updated!');
        return redirect('/profile-management/employee-assets');
    }

Answer 1

你可以只使用一个按钮，比如 blow:

Blade

<td class="text-center">
    <a href="#" data-toggle="modal" data-target="#myModal" class="edit"><i class="fa fa-comment"></i></a>
    <a href="{{route('asset.status',$joins->id)}}" id="return" data-toggle="modal" @if($joins->active === "1") class="edit  action-button" @else class="disabled2" @endif><i class="fa fa-get-pocket"></i></a>
</td>

PHP controller:

public function statusUpdate(Request $request,$id){
        $update = Asset::find($id);
        $update->active = !$update->active; // if true, it will give false

        $update->save();
        return \Resposne::json({status: true, active: $update->active});
    }

JavaScript:

在成功回调中使用响应:

<script>
    $(".action-button").click(function(){
        swal({
            type : 'warning',
            title: 'Submit what you want',
            input: 'text',
            showCancelButton: false,
            confirmButtonText: 'Submit',
            showLoaderOnConfirm: true,
            allowOutsideClick: false

        }).$.ajax({
        type: "POST",
        url : 'profile-management/employee-assets/update/{id}',
        data: { id: id },
        success: function(data){
            console.log(data,'data'); // {status: true, active: true/false }

         // Here use data to manipulate the button with id return, mean add/remove classes etc. d


            swal('Confirmed!','success')
        }

        });
    })

</script>