diff --git a/js/timelaps.js b/js/timelaps.js
index c04a262..5652951 100644
--- a/js/timelaps.js
+++ b/js/timelaps.js
@@ -35,15 +35,15 @@ function getPilotsByKart() {
                     "<div class=\"card shadow mb-4\">\n" +
                     "                    <div class=\"card-header py-3\">\n" +
                     "                        <h6 class=\"m-0 font-weight-bold text-primary\">\n" +
-                    "                            Pilot list - "+value.name+" \n" +
-                    "                            <a href=\"#\" class=\"btn btn-primary btn-circle\" title='Ajouter un piote au karting "+value.name+"'>\n" +
+                    "                            Pilot list - " + value.name + " \n" +
+                    "                            <a href=\"#\" class=\"btn btn-primary btn-circle\" title='Ajouter un piote au karting " + value.name + "'>\n" +
                     "                                <i class=\"fas fa-plus\"></i>\n" +
                     "                            </a>\n" +
                     "                        </h6>\n" +
                     "                    </div>\n" +
                     "                    <div class=\"card-body\">\n" +
                     "                        <div class=\"table-responsive\">\n" +
-                    "                            <table class=\"table table-bordered\" id=\"dataTable_pilots"+value.id+"\" width=\"100%\" cellspacing=\"0\">\n" +
+                    "                            <table class=\"table table-bordered\" id=\"dataTable_pilots" + value.id + "\" width=\"100%\" cellspacing=\"0\">\n" +
                     "                                <thead>\n" +
                     "                                <tr>\n" +
                     "                                    <th></th>\n" +
@@ -62,7 +62,7 @@ function getPilotsByKart() {
                     "                </div>" +
                     "");
 
-                $('#dataTable_pilots'+value.id).DataTable({
+                $('#dataTable_pilots' + value.id).DataTable({
                     data: value.drivers,
                     columns: [
                         {
@@ -142,7 +142,7 @@ function getKarts(id) {
     $.ajax({
         type: 'GET',
         crossDomain: true,
-        url: api_url + 'karts/'+id+'/',
+        url: api_url + 'karts/' + id + '/',
         dataType: 'json',
         success: function (data, status) {
             $('#id').val(data.id);
@@ -165,7 +165,7 @@ function listKarts() {
         url: api_url + 'karts/',
         dataType: 'json',
         success: function (data, status) {
-            if(tableListKart instanceof $.fn.dataTable.Api){
+            if (tableListKart instanceof $.fn.dataTable.Api) {
                 tableListKart.destroy();
             }
             tableListKart = $('#dataTable_kart_list').DataTable({
@@ -174,13 +174,13 @@ function listKarts() {
                     {
                         data: "id",
                         render: function (data, type, row, meta) {
-                            return  '<a href="#" onclick="" class="btn btn-primary btn-circle">' +
-                                        '<i class="fas fa-edit"></i>' +
-                                    '</a>' +
-                                    '&nbsp;' +
-                                    '<a href="#" onclick="if ( confirm( \'Do you want to delete the kart\' ) ) {deleteKarts('+data+','+meta.row+')}" class="btn btn-danger btn-circle">' +
-                                        '<i class="fas fa-trash"></i>' +
-                                    '</a>';
+                            return '<a href="#" onclick="modalEditKarts(' + data + ')" class="btn btn-primary btn-circle">' +
+                                '<i class="fas fa-edit"></i>' +
+                                '</a>' +
+                                '&nbsp;' +
+                                '<a href="#" onclick="if ( confirm( \'Do you want to delete the kart\' ) ) {deleteKarts(' + data + ',' + meta.row + ')}" class="btn btn-danger btn-circle">' +
+                                '<i class="fas fa-trash"></i>' +
+                                '</a>';
                         }
                     },
                     {
@@ -203,7 +203,7 @@ function deleteKarts(id, index) {
     $.ajax({
         type: 'DELETE',
         crossDomain: true,
-        url: api_url + 'karts/'+id+'/',
+        url: api_url + 'karts/' + id + '/',
         dataType: 'json',
         success: function (data, status) {
             $.notify("Delete done!", "success");
@@ -227,6 +227,7 @@ function addKarts(data) {
             $.notify("Update done!", "success");
             $('#modal_newkart').modal('hide');
             $("#saveKartChanges").prop('disabled', false);
+            $("#saveKartChanges").closest('form').find("input, textarea").val("");
             listKarts()
         },
         error: function (xhr) {
@@ -237,16 +238,18 @@ function addKarts(data) {
     });
 }
 
-function editKarts(data) {
+function modalEditKarts(id) {
+    $('#modal_newkart').modal('show');
     $.ajax({
-        type: 'PUT',
+        type: 'GET',
         crossDomain: true,
-        url: api_url + 'karts/1/',
+        url: api_url + 'karts/'+id+'/',
         dataType: 'json',
-        data: data,
         success: function (data, status) {
-            $.notify("Update done!", "success");
-            showKarts();
+            $('#id').val(data.id);
+            $('#name').val(data.name);
+            $('#autonomy').val(data.autonomy);
+            $('#comment').val(data.comment);
         },
         error: function (xhr) {
             $.notify("APIs unreachable!", "error");
@@ -255,12 +258,34 @@ function editKarts(data) {
     });
 }
 
+function editKarts(id, data) {
+    $.ajax({
+        type: 'PUT',
+        crossDomain: true,
+        url: api_url + 'karts/'+id+'/',
+        dataType: 'json',
+        data: data,
+        success: function (data, status) {
+            $.notify("Update done!", "success");
+            $('#modal_newkart').modal('hide');
+            $("#saveKartChanges").prop('disabled', false);
+            $("#saveKartChanges").closest('form').find("input, textarea").val("");
+            listKarts()
+        },
+        error: function (xhr) {
+            $.notify("APIs unreachable!", "error");
+            console.log('Request Status: ' + xhr.status + ' Status Text: ' + xhr.statusText + ' ' + xhr.responseText);
+            $("#saveKartChanges").prop('disabled', false);
+        },
+    });
+}
+
 function getDriver(id) {
 
     $.ajax({
         type: 'GET',
         crossDomain: true,
-        url: api_url + 'drivers/'+id+'/',
+        url: api_url + 'drivers/' + id + '/',
         dataType: 'json',
         success: function (data, status) {
             $('#id').val(data.id);
diff --git a/karts.html b/karts.html
index 156a171..afb3314 100644
--- a/karts.html
+++ b/karts.html
@@ -307,9 +307,17 @@
         $("#kartForm").submit(function (event) {
             $("#saveKartChanges").prop('disabled', true);
             event.preventDefault();
-            addKarts($( this ).serialize())
+            if($('#id').val() == ""){
+                addKarts($( this ).serialize())
+            }else{
+                editKarts($('#id').val(), $( this ).serialize())
+            }
         });
 
+        $('#modal_newkart').on('hide.bs.modal', function () {
+            $("#saveKartChanges").closest('form').find("input, textarea").val("");
+        })
+
     });
 
 </script>