Add confirmation popup on delete care or behavior.

src/main/resources/messages.properties

@@ -31,5 +31,7 @@ authentication.label.password=Password:
 authentication.placeholder.password=Password
 authentication.button.submit=Login
 animal_list.delete.modal_body=Do you want to delete this animal?
-animal_list.delete.modal_button_yes=Yes
+modal_button.delete=Delete
-animal_list.delete.modal_button_no=No
+modal_button.cancel=Cancel
+animal_cares_and_behaviors.delete.modal_body.behavior=Do you want to delete this behavior?
+animal_cares_and_behaviors.delete.modal_body.care=Do you want to delete this care?

src/main/resources/messages_en.properties

@@ -31,5 +31,7 @@ authentication.label.password=Password:
 authentication.placeholder.password=Password
 authentication.button.submit=Login
 animal_list.delete.modal_body=Do you want to delete this animal?
-animal_list.delete.modal_button_yes=Yes
+modal_button.delete=Delete
-animal_list.delete.modal_button_no=No
+modal_button.cancel=Cancel
+animal_cares_and_behaviors.delete.modal_body.behavior=Do you want to delete this behavior?
+animal_cares_and_behaviors.delete.modal_body.care=Do you want to delete this care?

src/main/resources/messages_fr.properties

@@ -31,5 +31,7 @@ authentication.label.password=Mot de passe :
 authentication.placeholder.password=Mot de passe
 authentication.button.submit=Connexion
 animal_list.delete.modal_body=Voulez-vous vraiment supprimer cet animal ?
-animal_list.delete.modal_button_yes=Oui
+modal_button.delete=Supprimer
-animal_list.delete.modal_button_no=Non
+modal_button.cancel=Annuler
+animal_cares_and_behaviors.delete.modal_body.behavior=Voulez-vous vraiment supprimer ce comportement ?
+animal_cares_and_behaviors.delete.modal_body.care=Voulez-vous vraiment supprimer ce soin ?

src/main/webapp/vue/animal_cares_and_behaviors.jsp

@@ -49,6 +49,7 @@
                                     <div class="col-lg-12">
                                         ${care.getName()}
                                         <form class="pull-right" action="${animalDeleteCareURL}/${care.getId()}" method="POST">
+                                            <input value="${care.getName()}" hidden />
                                             <button class="btn btn-danger" type="submit" data-toggle="tooltip" data-placement="bottom" title="Suppression"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></button>
                                         </form>
                                     </div>
@@ -81,6 +82,7 @@
                                     <div class="col-lg-12">
                                         ${consentBehavior.getName()}
                                         <form class="pull-right" action="${animalDeleteConsentBehaviorURL}/${consentBehavior.getId()}" method="POST">
+                                            <input value="${consentBehavior.getName()}" hidden />
                                             <button class="btn btn-danger" type="submit" data-toggle="tooltip" data-placement="bottom" title="Suppression"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></button>
                                         </form>
                                     </div>
@@ -104,11 +106,56 @@
 
             <%@ include file="base/footer.jsp" %>
         </div>
-    </body>
 
-    <script type="text/javascript">
+
-        $(document).ready(function () {
+        <div id="modal_delete_animal_care_or_behavior" class="modal fade" role="dialog">
-            $('[data-toggle="tooltip"]').tooltip();
+            <div class="modal-dialog">
-        });
+
+                <!-- Modal content-->
+                <div class="modal-content">
+                    <div class="modal-header">
+                        <button type="button" class="close" data-dismiss="modal">&times;</button>
+                        <h4 id="modal_delete_animal_care_or_behavior_title" class="modal-title"></h4>
+                    </div>
+                    <div class="modal-body">
+                        <p id="modal_delete_animal_care_or_behavior_body"></p>
+                    </div>
+                    <div class="modal-footer">
+                        <form id="modal_delete_animal_care_or_behavior_validate_delete" class="pull-right" action="" method="POST">
+                            <button type="button" class="btn btn-default" data-dismiss="modal"><fmt:message key="modal_button.cancel"></fmt:message></button>
+                            <button type="submit" class="btn btn-danger"><fmt:message key="modal_button.delete"></fmt:message></button>
+                            </form>
+                        </div>
+                    </div>
+
+                </div>
+            </div>
+        </body>
+
+        <script type="text/javascript">
+            $(document).ready(function () {
+                $('[data-toggle="tooltip"]').tooltip();
+
+                $("form").submit(function (event) {
+                    if ($(this).attr('id') !== 'modal_delete_animal_care_or_behavior_validate_delete') {
+                        var formUrl = $(this).attr('action');
+                        if (formUrl.startsWith('${animalDeleteCareURL}') || formUrl.startsWith('${animalDeleteConsentBehaviorURL}')) {
+                            // Only for deleting care or behavior forms
+                            var careOrBehaviorName = $(this).find('input')[0].value;
+                            $('#modal_delete_animal_care_or_behavior_title').text(careOrBehaviorName);
+                            $('#modal_delete_animal_care_or_behavior_validate_delete').attr('action', formUrl);
+                            if (formUrl.startsWith('${animalDeleteCareURL}')) {
+                                $('#modal_delete_animal_care_or_behavior_body').text('<fmt:message key="animal_cares_and_behaviors.delete.modal_body.care"></fmt:message>');
+                            } else if (formUrl.startsWith('${animalDeleteConsentBehaviorURL}')) {
+                                $('#modal_delete_animal_care_or_behavior_body').text('<fmt:message key="animal_cares_and_behaviors.delete.modal_body.behavior"></fmt:message>');
+                            }
+                            $('#modal_delete_animal_care_or_behavior').modal({
+                                show: true
+                            });
+                            event.preventDefault();
+                        }
+                    }
+                });
+            });
     </script>
 </html>

src/main/webapp/vue/animal_list.jsp

@@ -111,9 +111,9 @@
                         </div>
                         <div class="modal-footer">
                             <form id="modal_delete_animal_validate_delete" class="pull-right" action="" method="POST">
-                            <button type="submit" class="btn btn-danger"><fmt:message key="animal_list.delete.modal_button_yes"></fmt:message></button>
+                                <button type="button" class="btn btn-default" data-dismiss="modal"><fmt:message key="modal_button.cancel"></fmt:message></button>
+                                <button type="submit" class="btn btn-danger"><fmt:message key="modal_button.delete"></fmt:message></button>
                             </form>
-                            <button type="button" class="btn btn-default" data-dismiss="modal"><fmt:message key="animal_list.delete.modal_button_no"></fmt:message></button>
                         </div>
                     </div>