11$ ( document ) . ready ( function ( ) {
2- // //Validation here
3- // $("#postForm").validate({
4- // rules : {
5- // name : {
6- // required : true
7- // },
8- // species : {
9- // required : true
10-
11- // },
12- // family : {
13- // required : true
14-
15- // },
16- // class : {
17- // required : true
18- // },
19- // image : {
20- // required : true
21-
22- // },
23- // info : {
24- // required : true
25-
26- // }
27- // },
28- // messages: {
29- // name: "Animal name is required",
30- // species: "Species is required",
31- // family: "Animal must belong somewhere",
32- // class: "Class is required",
33- // image: "An image link is required",
34- // info: "Enter some info about this animal"
35- // },
36- // submitHandler: function(form) {
37- // alert("done")
38- // form.submit();
39- // }
40- // });
41-
42-
432 //set current time to dashboard
443 const monthNames = [ "January" , "February" , "March" , "April" , "May" , "June" ,
454 "July" , "August" , "September" , "October" , "November" , "December" ] ;
@@ -51,22 +10,34 @@ $(document).ready(function () {
5110 //limit character lenght
5211 function limitChar ( string ) {
5312 if ( string . length > 150 ) {
54- return string . substring ( 0 , 150 ) + '.....' ;
13+ return string . substring ( 0 , 155 ) + '.....' ;
14+ } else {
15+ return string ;
5516 }
5617 }
5718
5819 //declaring variable to be used later
59- let $divAppendEdit = $ ( '#divAppendEdit' ) ;
6020 let $divAppendAdmin = $ ( '#divAppendAdmin' ) ;
6121
62- let $name = $ ( '#putName' ) ; //tittle
63- let $species = $ ( '#putSpecies' ) ;
64- let $family = $ ( '#putFamily' ) ;
65- let $class = $ ( '#putClass' ) ;
66- let $category = $ ( '#putCategory' ) ;
67- let $external = $ ( '#putExternal' ) ;
68- let $image = $ ( '#putImage' ) ;
69- let $info = $ ( '#putInfo' ) ;
22+ //for editButton
23+ let $editName = $ ( '#putName' ) ; //tittle
24+ let $editSpecies = $ ( '#putSpecies' ) ;
25+ let $editFamily = $ ( '#putFamily' ) ;
26+ let $editClass = $ ( '#putClass' ) ;
27+ let $editCategory = $ ( '#putCategory' ) ;
28+ let $editExternal = $ ( '#putExternal' ) ;
29+ let $editImage = $ ( '#putImage' ) ;
30+ let $editInfo = $ ( '#putInfo' ) ;
31+
32+ //for POST request
33+ let $name = $ ( '#name' ) ;
34+ let $species = $ ( '#species' ) ;
35+ let $family = $ ( '#family' ) ;
36+ let $class = $ ( '#class' ) ;
37+ let $category = $ ( "#category" ) ;
38+ let $external = $ ( '#external' ) ;
39+ let $image = $ ( '#image' ) ;
40+ let $info = $ ( '#info' ) ;
7041
7142
7243 function addAnimalAdmin ( animal ) {
@@ -91,6 +62,23 @@ $(document).ready(function () {
9162 ` ) ;
9263 }
9364
65+ //Get all animals to admin dashboard
66+ function getAll ( ) {
67+ $ . ajax ( {
68+ type : 'GET' ,
69+ url : 'http://localhost:3000/animals' ,
70+ success : function ( animals ) {
71+ $ . each ( animals , ( i , animal ) => {
72+ addAnimalAdmin ( animal ) ;
73+ } )
74+ } ,
75+ error : function ( ) {
76+ alert ( 'error loading details' ) ;
77+ }
78+ } ) ;
79+ }
80+ getAll ( ) ;
81+
9482 //To search for a specific animal with name
9583 $ ( '#editTab' ) . click ( function ( e ) {
9684 e . preventDefault ( ) ;
@@ -115,58 +103,108 @@ $(document).ready(function () {
115103 } ) ;
116104
117105 //Delete a specific animal
118- $divAppendEdit . delegate ( '.remove' , 'click' , function ( e ) { //.delete has not been added to the page yet hence
106+ $divAppendAdmin . delegate ( '.remove' , 'click' , function ( e ) { //.delete has not been added to the page yet hence
119107 e . preventDefault ( ) ;
120108 let $div = $ ( this ) . closest ( 'div' ) ;
109+ const confirmDelete = confirm ( "Do you want to Delete this Animal ?" )
110+ if ( confirmDelete == true ) {
111+ $ . ajax ( {
112+ type : 'DELETE' ,
113+ url : 'http://localhost:3000/animals/' + $ ( this ) . attr ( 'data-id' ) ,
114+ success : function ( ) {
115+ $div . fadeOut ( 300 , function ( ) {
116+ $ ( this ) . closest ( '.col-md-4' ) . remove ( ) ;
117+ //$divAppendAdmin.delegate.remove();
118+ //$divAppendAdmin.empty();
119+ //getAll();
120+ Swal . fire ( {
121+ position : 'center' ,
122+ type : 'success' ,
123+ title : 'Animal deleted from the database' ,
124+ showConfirmButton : false ,
125+ timer : 1500
126+ } )
127+ } )
128+ } ,
129+ error : function ( ) {
130+ alert ( 'Error deleting animal' ) ;
131+ }
132+ } )
133+ }
134+ } )
121135
136+ //Edit animal detail
137+ $ ( '#saveEdit' ) . on ( "click" , function ( e ) {
138+ e . preventDefault ( ) ;
139+ $ ( '#postForm' ) . validate ( ) ;
140+
141+ const animal = {
142+ name : $editName . val ( ) ,
143+ species : $editSpecies . val ( ) ,
144+ family : $editFamily . val ( ) ,
145+ class : $editClass . val ( ) ,
146+ category : $editCategory . find ( ":selected" ) . text ( ) ,
147+ external : $editExternal . val ( ) ,
148+ image : $editImage . val ( ) ,
149+ info : $editInfo . val ( )
150+ } ;
151+
152+ //$('#saveEdit').trigger("reset");
122153 $ . ajax ( {
123- type : 'DELETE' ,
124- url : 'http://localhost:3000/animals/' + $ ( this ) . attr ( 'data-id' ) ,
154+ type : 'PUT' ,
155+ url : 'http://localhost:3000/animals/' + $ ( "#animalId" ) . val ( ) ,
156+ data : animal ,
125157 success : function ( ) {
126- $div . fadeOut ( 300 , function ( ) {
127- $ ( this ) . remove ( ) ;
128- } )
158+ getAll ( ) ;
129159 } ,
130160 error : function ( ) {
131- alert ( 'Error deleting animal' ) ;
161+ alert ( 'Error saving animal details' )
132162 }
133163 } )
134164 } )
135165
136- //Edit animal detail
137- $ ( '#saveEdit ' ) . on ( "click" , function ( e ) {
166+ //POST new animal to Database
167+ $ ( '#postForm ' ) . on ( 'submit' , function ( e ) {
138168 e . preventDefault ( ) ;
139169
140170 const animal = {
141171 name : $name . val ( ) ,
142172 species : $species . val ( ) ,
143173 family : $family . val ( ) ,
144174 class : $class . val ( ) ,
145- category : $category . find ( ":selected" ) . text ( ) ,
175+ category : $category . val ( ) ,
146176 external : $external . val ( ) ,
147177 image : $image . val ( ) ,
148178 info : $info . val ( )
149179 } ;
150180
151- // $('#saveEdit ').trigger("reset");
181+ $ ( '#postForm ' ) . trigger ( "reset" ) ;
152182 $ . ajax ( {
153- type : 'PUT ' ,
154- url : 'http://localhost:3000/animals/' + $ ( "#animalId" ) . val ( ) ,
183+ type : 'POST ' ,
184+ url : 'http://localhost:3000/animals' ,
155185 data : animal ,
156- success : function ( ) {
186+ success : function ( newAnimal ) {
187+ addAnimalAdmin ( newAnimal ) ;
188+ Swal . fire ( {
189+ position : 'center' ,
190+ type : 'success' ,
191+ title : 'Animal saved to database' ,
192+ showConfirmButton : false ,
193+ timer : 1500
194+ } )
157195 } ,
158196 error : function ( ) {
159- alert ( 'Error saving animal details ' )
160- }
197+ alert ( 'Error saving animal to database ' )
198+ } ,
161199 } )
162200 } )
163201
202+
164203 //logOut user
165204 $ ( '#log-out' ) . click ( function ( e ) {
166205 e . preventDefault ( ) ;
167206 localStorage . removeItem ( "password" ) ;
168207 localStorage . removeItem ( "username" )
169208 window . location . replace ( '../index.html' )
170209 } ) ;
171-
172210} )
0 commit comments