Hello, there is a basket on ajax

<form action="" id="form1" method="post"> <input name="name" type="hidden" value="Название" /> <input name="price" type="hidden" value="5000" /> <input name="id" type="hidden" value="5" /> <button class="cart">Купить</button> </form>

and script

 <script type="text/javascript"> $(document).ready(function () { $(".cart").click(function() { var parent = $(this).parent(); var id = parent.children()[0].value; var name = parent.children()[1].value; var price = parent.children()[2].value; $.ajax({ type: "POST", url: "/ajax/add_to_cart/", data: {id: id,name: name, price:price}, success: function(data){$(".cart").attr('disabled','disabled').html('Добавлено');} }); return false; }); }); </script>

Everything works, but does not work in that cases if I load the form with the load function. What can be wrong?

PS jquery ajax only teach

    1 answer 1

     $(document).ready(function () { $(".cart").live('click',function() { var parent = $(this).parent(); var id = parent.children()[0].value; var name = parent.children()[1].value; var price = parent.children()[2].value; $.ajax({ type: "POST", url: "/ajax/add_to_cart/", data: {id: id,name: name, price:price}, success: function(data){$(".cart").attr('disabled','disabled').html('Добавлено');} }); return false; }); });