这是我对StackOverflox的第一个问题(对此我感到非常紧张) 我在周末尝试了一些AJAx,但没有成功... 我关注了以下视频:https://www.youtube.com/watch?v=eJHHIcScqYA,并尝试按照我的代码进行操作。 我认为这和javascript :(请原谅我的法语!):
$(document).ready(function(){
$('#delete_beerlist').on("click", function(){
$.ajax({
url: '/beer_lists/' + this.parentElement.id,
type: 'DELETE',
succes: function(r){
}
});
});
});
<h3> Pression </h3>
<% @draft_beers.each do |item| %>
<tr id='<%= item.id%>'>
<td> <%= Beer.find(item.beer_id).name %> - </td>
<td> Prix pinte: <%= item.pint_price %> - </td>
<td> Prix demi: <%= item.half_pint_price %> - </td>
<td> <%= link_to "modifier les prix", edit_beer_list_path(item.id) %> - </td>
<td id='delete_beerlist'>Supprimer</td>
</tr> </br>
<% end %>
<h3> Bouteille </h3>
<% @bottle_beers.each do |item| %>
<tr id='<%=item.id%>'>
<td> <%= Beer.find(item.beer_id).name %> -</td>
<td> Prix bouteille: <%= item.bottle_price %> -</td>
<td> <%= link_to "modifier le prix", edit_beer_list_path(item.id) %> </td> -
<td id='delete_beerlist'>Supprimer</td>
</tr> </br>
<% end %>
并且onClick在我的控制台中什么也没给出。我有gem'jquery-rails',在我的application.js中需要'jquery3',这让我很生气。 感谢您的帮助!
编辑:这是我生成的HTML代码
<!DOCTYPE html>
<html>
<head>
<title>Beerly</title>
<meta name="csrf-param" content="authenticity_token" />
<meta name="csrf-token" content="B9vuLIENHSH2351ga9VW44ka6PFPLEP8Cu6zdMfgMZDZeuDKVWWrmafMTDAWdBmdRGfyLrpEStZ7xcUgOUjH5Q==" />
<link rel="stylesheet" media="all" href="/assets/r-chrome.self-cc72d6b06fc2d60739fd45c645a0689aa61b37cf49950538dacaeb5a7ecc5d79.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/r-firefox.self-89fb2eca5e6840a84fbfd889939e747e6b41b2b590bcd6c2ac44f8ae5c48cd3e.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/bootstrap.min.self-43023147d9420f0da40facdf09ece46460a1ea2eee23a03ab10f3d16b895ea52.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/apropos.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/bars.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/beer_lists.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/beers.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/contact.self-af976636f1970c397e9281424f2a0e5f37bf97cd6ab2013e5c0cb44f3588c8c7.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/custom-bootstrap.self-7a5e46bedd72d2a3a75604d3c99e0355fdb7cb28935a7dac9c2d9bc73c8aca93.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/home.self-eb5ab899aa47638786ef95d408c673b47fff2391e7850978006620a39c79c532.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/hover.self-dd1c301d16e4556535c6986f12eaa121f5253bbbf59645fb836e2b0bcf2beb0f.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/map.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/mentionlegale.self-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/resultpage.self-6795a6e6f5532b292242295b7172cd1a59b9bb2ad4e6f16d4d5790e1bb0e4b8f.css?body=1" />
<link rel="stylesheet" media="all" href="/assets/application.self-7dd66a9c9e781d6a4fbcc394eaae76758454669b87bd4cb570df5cdba9afb664.css?body=1" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<header id="shd">
<nav class="navbar navbar-expand-lg navbar-light container pt-4 pb-4">
<div class="navbar-brand"><a href="/"><img class="logo" alt="logo" src="/assets/logo-68dee4b2513dbe544670d3e6e11b3dee11c0c5f78567b0baf41e4e87d7a2d11e.svg" /></a></div>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="/">Accueil</a>
</li>
<li class="nav-item">
<a class="nav-link" href="contact">Contact</a>
</li>
<li class="nav-item">
<a class="nav-link" href="apropos">À propos</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/managers/bars/1/edit">Mon bar</a>
</li>
<li class="nav-item">
<a class="nav-link" rel="nofollow" data-method="delete" href="/managers/sign_out">Se déconnecter</a>
</li>
</ul>
</div>
</nav>
<header>
<body>
<h2> Ma carte </h2>
<h3> Pression </h3>
<tr id='3'>
<td> La Chouffe - </td>
<td> Prix pinte: 5.0 - </td>
<td> Prix demi: 2.5 - </td>
<td> <a href="/beer_lists/3/edit">modifier les prix</a> - </td>
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='5'>
<td> La Chouffe - </td>
<td> Prix pinte: 5.0 - </td>
<td> Prix demi: 2.5 - </td>
<td> <a href="/beer_lists/5/edit">modifier les prix</a> - </td>
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='7'>
<td> La Chouffe - </td>
<td> Prix pinte: 5.0 - </td>
<td> Prix demi: 2.5 - </td>
<td> <a href="/beer_lists/7/edit">modifier les prix</a> - </td>
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='13'>
<td> La Chouffe - </td>
<td> Prix pinte: 5.0 - </td>
<td> Prix demi: 2.5 - </td>
<td> <a href="/beer_lists/13/edit">modifier les prix</a> - </td>
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='15'>
<td> La Chouffe - </td>
<td> Prix pinte: 5.0 - </td>
<td> Prix demi: 2.5 - </td>
<td> <a href="/beer_lists/15/edit">modifier les prix</a> - </td>
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='19'>
<td> La Chouffe - </td>
<td> Prix pinte: 5.0 - </td>
<td> Prix demi: 2.5 - </td>
<td> <a href="/beer_lists/19/edit">modifier les prix</a> - </td>
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<h3> Bouteille </h3>
<tr id='2'>
<td> La Chouffe -</td>
<td> Prix bouteille: 7.0 -</td>
<td> <a href="/beer_lists/2/edit">modifier le prix</a> </td> -
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='4'>
<td> La Chouffe -</td>
<td> Prix bouteille: 7.0 -</td>
<td> <a href="/beer_lists/4/edit">modifier le prix</a> </td> -
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='6'>
<td> La Chouffe -</td>
<td> Prix bouteille: 7.0 -</td>
<td> <a href="/beer_lists/6/edit">modifier le prix</a> </td> -
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='8'>
<td> La Chouffe -</td>
<td> Prix bouteille: 7.0 -</td>
<td> <a href="/beer_lists/8/edit">modifier le prix</a> </td> -
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='10'>
<td> La Chouffe -</td>
<td> Prix bouteille: 7.0 -</td>
<td> <a href="/beer_lists/10/edit">modifier le prix</a> </td> -
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='12'>
<td> La Chouffe -</td>
<td> Prix bouteille: 7.0 -</td>
<td> <a href="/beer_lists/12/edit">modifier le prix</a> </td> -
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='14'>
<td> La Chouffe -</td>
<td> Prix bouteille: 7.0 -</td>
<td> <a href="/beer_lists/14/edit">modifier le prix</a> </td> -
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='16'>
<td> La Chouffe -</td>
<td> Prix bouteille: 7.0 -</td>
<td> <a href="/beer_lists/16/edit">modifier le prix</a> </td> -
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='18'>
<td> La Chouffe -</td>
<td> Prix bouteille: 7.0 -</td>
<td> <a href="/beer_lists/18/edit">modifier le prix</a> </td> -
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<tr id='20'>
<td> La Chouffe -</td>
<td> Prix bouteille: 7.0 -</td>
<td> <a href="/beer_lists/20/edit">modifier le prix</a> </td> -
<td class='delete_beerlist'>Supprimer</td>
</tr> </br>
<h1>Cherche ta bière </h1>
<form action="/managers/beer_lists" accept-charset="UTF-8" method="get"><input name="utf8" type="hidden" value="✓" />
<input type="text" name="term" id="term" />
<input type="submit" value="Search" data-disable-with="Search" />
</form></br>
</br>
<!-- Footer -->
<footer class="page-footer font-small sticky-bottom pt-5 pb-5 mt-6">
<div class="container">
<!-- Footer Links -->
<div class="container-fluid text-center text-md-left">
<!-- Grid row -->
<div class="row">
<!-- Grid column -->
<div class="col-md-6 mt-md-0 mt-3 text-dark">
<!-- Content -->
<div class="navbar-brand"><a href="/"><img class="logo-footer" alt="logo" src="/assets/logo-68dee4b2513dbe544670d3e6e11b3dee11c0c5f78567b0baf41e4e87d7a2d11e.svg" /></a></div>
</div>
<!-- Grid column -->
<hr class="clearfix w-100 d-md-none pb-3">
<!-- Grid column -->
<div class="col-md-3 mb-md-0 mb-3">
<!-- Links -->
<h5 class="text-uppercase text-dark">Links</h5>
<ul class="list-unstyled text-dark">
<li>
<a href="#!" class="nav-item">Link 1</a>
</li>
<li>
<a href="#!" class="nav-item">Link 2</a>
</li>
<li>
<a href="#!" class="nav-item">Link 3</a>
</li>
<li>
<a href="#!" class="nav-item">Link 4</a>
</li>
</ul>
</div>
<!-- Grid column -->
<!-- Grid column -->
<div class="col-md-3 mb-md-0 mb-3 text-dark">
<!-- Links -->
<h5 class="text-uppercase">Links</h5>
<ul class="list-unstyled">
<li>
<a class="nav-item" href="/">Accueil</a>
</li>
<li>
<a class="nav-item" href="contact">Contact</a>
</li>
<li>
<a class="nav-item" href="apropos">À propos</a>
</li>
<li>
<a class="nav-item" href="mentions-legales">Mentions Légales</a>
</li>
</ul>
</div>
<!-- Grid column -->
</div>
<!-- Grid row -->
</div>
<!-- Footer Links -->
<!-- Copyright -->
</div>
</footer>
<script src="/assets/popper.min.self-71f355c150b0a532df467fea2bf02ec471bcfe1c86463c9a71a32f5fe94c3007.js?body=1"></script>
<script src="/assets/bootstrap.min.self-a8e68c223de43929594bd637b85532a803195ce936a435f51c444e697dac8d1f.js?body=1"></script>
<script src="/assets/rails-ujs.self-d109d8c5c0194c8ad60b8838b2661c5596b5c955987f7cd4045eb2fb90ca5343.js?body=1"></script>
<script src="/assets/activestorage.self-1ed4604ac2170045f1ffca4edb81a75246661555e4f9cf682bb8a21825e32e1c.js?body=1"></script>
<script src="/assets/jquery3.self-5af507e253c37e9c9dcf65064fc3f93795e6e28012780579975a4d709f4074ad.js?body=1"></script>
<script src="/assets/beer_lists.self-eac9e7c016b6d45c447b1b13a02c83b6657ec16316db179d1c59593c227112b3.js?body=1"></script>
<script src="/assets/action_cable.self-69fddfcddf4fdef9828648f9330d6ce108b93b82b0b8d3affffc59a114853451.js?body=1"></script>
<script src="/assets/cable.self-8484513823f404ed0c0f039f75243bfdede7af7919dda65f2e66391252443ce9.js?body=1"></script>
<script src="/assets/application.self-6a7f81c89608537f1c0b5e6e1a1cad14caec515ae09b88e0406efa9bcbfd4752.js?body=1"></script>
</body>
</html>