【问题标题】:Wishlist heart icon color change based on selection in laravel 5.7根据 laravel 5.7 中的选择心愿单心形图标颜色变化
【发布时间】:2020-05-03 03:13:54
【问题描述】:

我的编码要求是“当我点击心愿单图标时。如果我没有登录,那么我将进入登录页面,如果我正在登录,那么当我添加项目时,fa-fa 的心脏颜色会变为橙色在愿望清单和灰色删除时。我正在发送 json 响应参考我的编码。

控制器:

public function add_to_wishlist(Request $req)
    {
         $userId=Session::get('userid');
         if(empty($userId))
         {
            return response()->json(['status'=> 1]);
         }
        else
         {
            $checkWishlist=DB::select('select * from wishlist where user_id=? && product_id=?',[$userId,$req->sub_id]);
             if($checkWishlist)
             {
               DB::table('wishlist')->where('user_id',$userId)->where('product_id',$req->sub_id)->delete();
               return response()->json(['status'=> 2]);              
             }
             else
             {
              DB::table('wishlist')->insert(['user_id'=>$userId,'product_id'=>$req->sub_id]);
              return response()->json(['status'=> 3]);
             }
         }
    }

刀片代码:

 <input type="text"  name="status" id="status" class="form-control status" value="">
                    <a class="sub" data-id="{{$value->sub_id}}" href="#"><i class="fa fa-heart" style="float:right;color:grey"></i></a>

jquery 和 ajax:

<script type="text/javascript">
  $(document).ready(function(){
  $('.sub').click(function(e) { 

    var sub_id=$(this).attr('data-id');
    var input=$(this).prev();
    e.preventDefault()
               $.ajaxSetup({
                  headers: {
                      'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                  }
              });
         jQuery.ajax({

                  url: "{{ url('/add-to-wishlist') }}",
                  method: 'get',
                  data: {
                     sub_id: sub_id,
                  },
                  success: function(result){
                     input.val(result.status);

                  }});

  });
 });

</script>

【问题讨论】:

  • 你得到的回应是什么

标签: ajax laravel


【解决方案1】:

先添加dataType:'JSON'

然后在success函数中添加一些条件:

$('.sub').click(function(e) {
var input = $(this);
...
...
$.ajax({
...
success: function(result){
    var status = result.status;
    input.val(status);
    if(status==1){
    //Not logged in
    window.location.href ="path/to/login";
    }else if(status==2){
    //Delete
    input.next().css('background','gray');
    }else{
    //Logged in
    input.next().css('background','orange');
    }
}});
});
});

【讨论】:

    猜你喜欢
    • 2021-04-30
    • 2016-06-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-11-29
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多