Add product to wishlist using ajax | laravel

 



Route as
Route::get('add/wishlist/{id}','Wishlist\WishlistController@addwishlist')->name('wishlist');

Controller as
 public function addwishlist($id){

        $userid=Auth::id();

        $check=Wishlist::where('user_id',$userid)->where('product_id',$id)->first();
        $data=array(
            'user_id'=>$userid,
            'product_id'=>$id
        );

        if(Auth::check()){
            if($check){
                return response()->json(['error'=>'This product is already in your Wishlist']);

            }else{
                Wishlist::create($data);
                return response()->json(['success'=>'product added to wishlist']);
            }
        }

        else{
           return response()->json(['error'=>'login to your accunt to add wishlist']);
        }



    }

in the blade extended file

  <button class="addwishlist" data-id="{{ $status_products->id }}">
               <div class="product_fav"><i class="fas fa-heart"></i></div>
   </button>

 <script src="https://code.jquery.com/jquery-3.5.1.min.js" 
        integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0="
             crossorigin="anonymous"></script>

<script>
    $(document).ready(function(){
        $('.addwishlist').on('click',function(){
            var id=$(this).data('id');
            if(id){
                $.ajax({
                    url:"{{ url('add/wishlist/') }}/"+id,
                    type:"GET",
                    dataType:'json',
                    success:function(data){
                        const Toast = Swal.mixin({
                                toast: true,
                                position: 'top-end',
                                showConfirmButton: false,
                                timer: 3000,
                                timerProgressBar: true,
                                didOpen: (toast=> {
                                  toast.addEventListener('mouseenter'Swal.stopTimer)
                                  toast.addEventListener('mouseleave'Swal.resumeTimer)
                                }
                                })
                                if($.isEmptyObject(data.error)){

                                Toast.fire({
                                icon: 'success',
                                title: data.success
                                    })
                                }
                                else{
                                    Toast.fire({
                                icon: 'error',
                                title: data.error
                                 })
                                }
                    },
                });
            }else{
                alert('danger');
            }
        });

    });
</script>


in the blade file from where above file was extended

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/10.14.0/sweetalert2.min.css" 
        integrity="sha512-A374yR9LJTApGsMhH1Mn4e9yh0ngysmlMwt/uKPpudcFwLNDgN3E9S/ZeHcWTbyhb5bVHCtvqWey9DLXB4MmZg==" 
            crossorigin="anonymous" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/10.14.0/sweetalert2.all.min.js" 
        integrity="sha512-LXVbtSLdKM9Rpog8WtfAbD3Wks1NSDE7tMwOW3XbQTPQnaTrpIot0rzzekOslA1DVbXSVzS7c/lWZHRGkn3Xpg=="
         crossorigin="anonymous"></script>


<script>
    @if(Session::has('message'))
    var type="{{ Session::get('alert-type','info') }}"
    switch (type) {
        case 'info':
            toast.info("{{ Session::get('message') }}");

            break;
        case 'success':
            toast.success("{{ Session::get('message') }}");

            break;
        case 'warning':
            toast.warning("{{ Session::get('message') }}");

            break;
        case 'error':
            toast.error("{{ Session::get('message') }}");

            break;


        default:
            break;
    }
    @endif
</script>

Post a Comment

Previous Post Next Post