jquery - help with ajax only working once -
been trying put function make live calls, can't figure out.
this works once:
<script> $(document).ready(function(){ $(".addfavorite").click(function(){ var row = $(this); $.ajax({ type: "post", url: "/app/favs/jsoncreate?id=<%= @place.ven_id %>&name=<%= @place.name %>", success: function(data){ $(row).replacewith('<div id="' + data + '" class="vfav vbtn deletefavorite"><img src="/public/images/icons/favorite-.png" alt="favorite -"></div>'); } }); }); $('.deletefavorite').click(function(){ var id = $(this).attr('id'); var row = $(this); $.ajax({ type: "post", url: "/app/favs/jsondelete?id=" + id, async: true, data: id, success: function(data){ if (data == "1"){ $(row).replacewith('<div class="vfav vbtn addfavorite"><img src="/public/images/icons/favorite.png" alt="favorite"></div>'); } if (data == "0"){ alert("delete failed!") } }, error: function(response){ alert('favorite delete failed!'); } }); }); }); </script>
as others have noted, using .replacewith()
removing event handlers bound element.
consider using .delegate()
on common parent of elements.
<div id="somecommonparent"> <div class="vfav vbtn addfavorite"> <img src="/public/images/icons/favorite.png" alt="favorite"> </div> </div> $('#somecommonparent').delegate('.addfavorite', 'click', function () { var row = $(this); $.ajax({ type: "post", url: "/app/favs/jsoncreate?id=<%= @place.ven_id %>&name=<%= @place.name %>", success: function (data) { $(row).replacewith('<div id="' + data + '" class="vfav vbtn deletefavorite"><img src="/public/images/icons/favorite-.png" alt="favorite -"></div>'); } }); }).delegate('.deletefavorite', 'click', function () { var id = $(this).attr('id'); var row = $(this); $.ajax({ type: "post", url: "/app/favs/jsondelete?id=" + id, async: true, data: id, success: function (data) { if (data == "1") { $(row).replacewith('<div class="vfav vbtn addfavorite"><img src="/public/images/icons/favorite.png" alt="favorite"></div>'); } if (data == "0") { alert("delete failed!") } }, error: function (response) { alert('favorite delete failed!'); } }); });
Comments
Post a Comment