A few easy questions

A few easy questions

Hello, everyone,
The question is rather simple. How do I ( with example, please ) ;

1. Create a simple update/delete user interface


2. Use at least one jQuery UI, such as sortable, draggable, dialog,... )


3. Add a jQuery animation


Thank you in advance! :D

  1. $(document).ready(function(){ 
  2. var API=" http://193.246.33.24/data/ " 
  3. var users = $("#users"); 

  5. $.get(API, {user:13}, function(data){ 
  6. $.each(data, function(i, usr){ 
  7. addUser(usr); 
  8. }); 
  9. }); 

  11. function addUser(usr){ 
  12. users.append("<tr data-id=" + usr.id + "><td>"+ usr.name + "</td><td>" + usr.surname + "</td><td><button class='btn btn-danger delete'>Delete</button></td></tr>"); 

  14. }; 

  16. var dialog = $( "#dialog" ).dialog({ 
  17. autoOpen : false, 
  18. modal : true, 
  19. buttons:{ 
  20. "Dodaj novog" : function(){ 
  21. form.submit(); 
  22. }, 
  23. Cancel: function(){ 
  24. dialog.dialog("close") 
  25. } 
  26. }, 
  27. close: function() { 
  28. form[0].reset(); 
  29. } 
  30. }); 
  31. $("#addNew").on("click", function(){ 
  32. dialog.dialog("open"); 
  33. }); 

  35. var form = dialog.find("form"); 

  37. form.on("submit", function(e){ 
  38. e.preventDefault(); 

  40. $.post(API + "create", form.serialize()).done(function(data){ 
  41. addUser(data); 
  42. dialog.dialog("close"); 
  43. }).fail(function(error) { 
  44. console.log(error.responseText); 
  45. }) 

  47. }); 

  49. users.on("click",".delete", function(){ 
  50. var row = $(this).closest("tr"); 
  51. $.post(API + "destroy/" + row.data("id"), {}, function(data){ 
  52. row.fadeOut(function(){ 
  53. $(this).remove(); 
  54. }); 
  55. }); 
  56. }); 


  59. });
193.246.33.24
[ { "user": 999, "name": "Pero", "surname": "Perić", "createdAt": "2015-05-29T11:46:00.034Z", "updatedAt": "2015-05-29T11:49:26.915Z", "id": 7 }, { "user": 2, "name": "Bareuu", "surname": "svirajMajkeu", "createdAt": "2015-05-29T11:51:56.808Z", "updatedAt": "2015-05-29T11:56:51.319Z", "id": 10, "hob…
193.246.33.24