I am creating a to do app and I am trying to delete an item without rendering a new page I am Below is the code for the list of codes.
& lt; Ul id = "unordered_list" & gt; & Lt; Div class = "to_do_list" & gt; & Lt;% @ list.each_with_index | List, i | & Gt%; & Lt; Li data-index = "& lt;% = i% & gt;" & Gt; & Lt;% = link_to list.title, '#'% & gt; & Lt; Ol id = "list_items_ My question is, how can I use AJAX to delete items when I click on the deleted button? I tried to do this
$ ('# unordered_list') ('Input: delete'). ('Ajax: Success', function (event) {$ (Event.ContentTarget) .Parent (). Remove ();}) Can anyone tell me what I do? Wrong done I think the way I'm trying to retrieve the jQuery object to click and delete is wrong, but I'm not able to find any further solutions. Your help is greatly appreciated!
Some things:
Your selector is wrong for the deleted link - you Looking for an input, while link_to to generate an anchor tag.
In addition, in the callback function you can use "this" to get the element that triggers that event.
In addition to this, parents will find the closest to calling "parents" when in reality you want to remove the inventory item, you should use the "closest", to cross the dom tree. Takes a matching element till.
You can use it instead:
$ ('# unordered_list li a'). ('Ajax: success', function (event) {$ (this) .closest ('li'). Remove ();})
No comments:
Post a Comment