php - Javascript doesn't work on blade laravel -
i'm trying create table can delete row clicking button on it's last cell doesn't work. move test project (without laravel), works, doesn't work on blade laravel. have tried many ways can still couldn't figure out.
<link rel="stylesheet" type="text/css" href=" {{asset('public/css/cart.css')}}"> <script type="text/javascript"> $("td.cart_delete").on("click", function () { alert("on click"); $(this).closest("tr").remove(); }); </script> @extends('layouts.layout') @section('content') <section id="cart_items"> <div class="container"> <div class="breadcrumbs"> <ol class="breadcrumb"> <li><a href="#">trang chủ</a></li> <li class="active">giỏ hàng</li> </ol> </div> <div class="table-responsive cart_info"> <table class="table table-condensed"> <thead> <tr class="cart_menu"> <td class="image">mặt hàng</td> <td class="description">mô tả</td> <td class="price">giá</td> <td class="quantity">số lượng</td> <td class="total">thành tiền</td> <td></td> </tr> </thead> <tbody> <tr> <td class="cart_product"> <a href=""><img src="images/cart/one.png" alt=""></a> <!-- cái này chứa ảnh của sp --> </td> <td class="cart_description"> <h4><a href="">tên sản phẩm</a></h4> <!-- tên sản phẩm --> <p><a>phan thanh tuyên</a></p> </td> <td class="cart_price"> <p>120.000 vnĐ</p> <!-- giá --> </td> <td class="cart_quantity"> <!-- số lượng --> <div class="cart_quantity_button"> <!-- <a class="cart_quantity_up" href=""> + </a> --> <button class="add-btn">+</button> <input class="cart_quantity_input" type="text" name="quantity" value="1" autocomplete="off" size="2" id="so_luong"> <!-- Đây cần thay đổi số lượng sản phẩm mua theo csdl --> <!-- <a class="cart_quantity_down" href=""> - </a> --> <button class="minus-btn">-</button> </div> </td> <td class="cart_total"> <p class="cart_total_price">$59</p> </td> <td class="cart_delete"> <!-- <a class="cart_quantity_delete" href=""><i class="fa fa-times"></i></a> Đây là nút delete một sản phẩm trong giỏ hàng. chưa biết nên để <button> hay <a>. cái này tùy cách xử lý của ô --> <button class="quantity_delete"><i class="fa fa-times"></i></button> </td> </tr> <tr> <td class="cart_product"> <a href=""><img src="images/cart/two.png" alt=""></a> </td> <td class="cart_description"> <h4><a href="">colorblock scuba</a></h4> <p>web id: 1089772</p> </td> <td class="cart_price"> <p>$59</p> </td> <td class="cart_quantity"> <div class="cart_quantity_button"> <button class="add-btn">+</button> <input class="cart_quantity_input" type="text" name="quantity" value="1" autocomplete="off" size="2"> <button class="minus-btn">-</button> </div> </td> <td class="cart_total"> <p class="cart_total_price">$59</p> </td> <td class="cart_delete"> <!-- <a class="cart_quantity_delete" href=""><i class="fa fa-times"></i></a> --> </td> </tr> <tr> <td class="cart_product"> <a href=""><img src="images/cart/three.png" alt=""></a> </td> <td class="cart_description"> <h4><a href="">colorblock scuba</a></h4> <p>web id: 1089772</p> </td> <td class="cart_price"> <p>$59</p> </td> <td class="cart_quantity"> <div class="cart_quantity_button"> <button class="add-btn">+</button> <input class="cart_quantity_input" type="text" name="quantity" value="1" autocomplete="off" size="2"> <button class="minus-btn">-</button> </div> </td> <td class="cart_total"> <p class="cart_total_price">$59</p> </td> <td class="cart_delete"> <!-- <a class="cart_quantity_delete" href=""><i class="fa fa-times"></i></a> --> </td> </tr> </tbody> </table> </div> </div> </section> <!--/#cart_items--> <section id="do_action"> <div class="container"> <div class="row"> <!-- <div class="col-sm-6"> </div> --> <div class="col-sm-6"> <div class="total_area"> <ul> <li>cart sub total <span>$59</span></li> <li>eco tax <span>$2</span></li> <li>shipping cost <span>free</span></li> <li>total <span>$61</span></li> </ul> <a class="btn btn-default update" href="{{url('cart')}}">update</a> <a class="btn btn-default check_out" href="{{url('checkout')}}">check out</a> </div> </div> </div> </div> </section><!--/#do_action--> @endsection thanks help!
assume jquery working.
here is,
<link rel="stylesheet" type="text/css" href=" {{asset('public/css/cart.css')}}"> @extends('layouts.layout') @section('content') <section id="cart_items"> <div class="container"> <div class="breadcrumbs"> <ol class="breadcrumb"> <li><a href="#">trang chủ</a></li> <li class="active">giỏ hàng</li> </ol> </div> <div class="table-responsive cart_info"> <table class="table table-condensed"> <thead> <tr class="cart_menu"> <td class="image">mặt hàng</td> <td class="description">mô tả</td> <td class="price">giá</td> <td class="quantity">số lượng</td> <td class="total">thành tiền</td> <td></td> </tr> </thead> <tbody> <tr> <td class="cart_product"> <a href=""><img src="images/cart/one.png" alt=""></a> <!-- cái này chứa ảnh của sp --> </td> <td class="cart_description"> <h4><a href="">tên sản phẩm</a></h4> <!-- tên sản phẩm --> <p><a>phan thanh tuyên</a></p> </td> <td class="cart_price"> <p>120.000 vnĐ</p> <!-- giá --> </td> <td class="cart_quantity"> <!-- số lượng --> <div class="cart_quantity_button"> <!-- <a class="cart_quantity_up" href=""> + </a> --> <button class="add-btn">+</button> <input class="cart_quantity_input" type="text" name="quantity" value="1" autocomplete="off" size="2" id="so_luong"> <!-- Đây cần thay đổi số lượng sản phẩm mua theo csdl --> <!-- <a class="cart_quantity_down" href=""> - </a> --> <button class="minus-btn">-</button> </div> </td> <td class="cart_total"> <p class="cart_total_price">$59</p> </td> <td class="cart_delete"> <!-- <a class="cart_quantity_delete" href=""><i class="fa fa-times"></i></a> Đây là nút delete một sản phẩm trong giỏ hàng. chưa biết nên để <button> hay <a>. cái này tùy cách xử lý của ô --> <button class="quantity_delete" id="c_delete"><i class="fa fa-times"></i></button> </td> </tr> <tr> <td class="cart_product"> <a href=""><img src="images/cart/two.png" alt=""></a> </td> <td class="cart_description"> <h4><a href="">colorblock scuba</a></h4> <p>web id: 1089772</p> </td> <td class="cart_price"> <p>$59</p> </td> <td class="cart_quantity"> <div class="cart_quantity_button"> <button class="add-btn">+</button> <input class="cart_quantity_input" type="text" name="quantity" value="1" autocomplete="off" size="2"> <button class="minus-btn">-</button> </div> </td> <td class="cart_total"> <p class="cart_total_price">$59</p> </td> <td class="cart_delete"> <!-- <a class="cart_quantity_delete" href=""><i class="fa fa-times"></i></a> --> </td> </tr> <tr> <td class="cart_product"> <a href=""><img src="images/cart/three.png" alt=""></a> </td> <td class="cart_description"> <h4><a href="">colorblock scuba</a></h4> <p>web id: 1089772</p> </td> <td class="cart_price"> <p>$59</p> </td> <td class="cart_quantity"> <div class="cart_quantity_button"> <button class="add-btn">+</button> <input class="cart_quantity_input" type="text" name="quantity" value="1" autocomplete="off" size="2"> <button class="minus-btn">-</button> </div> </td> <td class="cart_total"> <p class="cart_total_price">$59</p> </td> <td class="cart_delete"> <!-- <a class="cart_quantity_delete" href=""><i class="fa fa-times"></i></a> --> </td> </tr> </tbody> </table> </div> </div> </section> <!--/#cart_items--> <section id="do_action"> <div class="container"> <div class="row"> <!-- <div class="col-sm-6"> </div> --> <div class="col-sm-6"> <div class="total_area"> <ul> <li>cart sub total <span>$59</span></li> <li>eco tax <span>$2</span></li> <li>shipping cost <span>free</span></li> <li>total <span>$61</span></li> </ul> <a class="btn btn-default update" href="{{url('cart')}}">update</a> <a class="btn btn-default check_out" href="{{url('checkout')}}">check out</a> </div> </div> </div> </div> </section><!--/#do_action--> <script type="text/javascript"> $("td.cart_delete").on("click", function () { alert("on click"); $(this).closest("tr").remove(); }); </script> @endsection before click,
after click
Comments
Post a Comment