Edition ok

MobiParc/assets/js/main.js

@@ -46,14 +46,30 @@ if ('serviceWorker' in navigator) {
 
 var sectionId;
 var section;
+var objId;
 
 var load = function () {
     // Vide la section main
     $("#main").empty();
 
+
+
     // Page en cours
-    sectionId = (window.location.hash.slice(1).length > 0 ? window.location.hash.slice(1) : "index");
-    section = $("body").find('#' + sectionId);
+    var base = window.location.hash.split('?')[0];
+    sectionId = base.length > 0 ? base : "#index";
+    section = $("body").find(sectionId);
+    console.log("Section: " + sectionId);
+    
+    var qry = {};
+    var qrystr = window.location.hash.split('?')[1];
+    if (qrystr) {
+        var definitions = qrystr.split('&');
+        definitions.forEach(function (val, key) {
+            var parts = val.split('=', 2);
+            qry[parts[0]] = parts[1];
+        });
+    }
+    console.log("Query: " + qry);
 
     // compile la section avec handlebars
     if ($(section).attr("model")) {
@@ -79,10 +95,27 @@ var load = function () {
             db = request.result;
             txs = db.transaction(model, "readonly");
             store = txs.objectStore(model);
-            store.getAll().onsuccess = function (event) {
-                var data = { data: event.target.result };
-                $("#main").html(template(data));
-            };
+
+            if (!qry["id"]) {
+                store.getAll().onsuccess = function (event) {
+                    var data = { data: event.target.result };
+                    $("#main").html(template(data));
+                };
+            }
+            else {
+                store.get(qry["id"]).onsuccess = function (event) {
+                    var data = { data: event.target.result };
+                    $("#main").html(template(data));
+                    $("input, select, textarea").each(function () {
+                        var input = $(this);
+                        var fieldName = input.attr('id');
+                        console.log(fieldName + ': ' + data['data'][fieldName]);
+                        input.val(data['data'][fieldName]);
+                    });
+                }
+            }
+
+
         };
 
         request.onerror = function () {
@@ -121,7 +154,7 @@ var load = function () {
         $("#main").off("click", ".del");
         $("#main").on("click", ".del", function (event) {
             var del = $(this);
-            if (confirm("Supprimer la selection!") == true) {
+            if (confirm("Supprimer la selection?") == true) {
 
                 $(del).prop("disabled", true);
 
@@ -139,6 +172,23 @@ var load = function () {
             }
         });
 
+        // Gere le clic sur un bouton editer
+        $("#main").off("click", ".edit");
+        $("#main").on("click", ".edit", function (event) {
+            var edit = $(this);
+           
+            var id = $(".ui-selected:first").data("id")
+
+            txs = db.transaction(model, "readonly");
+            store = txs.objectStore(model);
+            var obj = store.get(id);
+
+            obj.onsuccess = function (event) {
+                window.location = "/#activites?id=" + id;
+            };
+
+        });
+
     }
     else {
         //template = Handlebars.compile(section.html());
@@ -205,6 +255,7 @@ mo = new MutationObserver(function (mutations, observer) {
         filter: "tr",
         stop: function () {
             $(".del").prop('disabled', ($(".ui-selected").length == 0));
+            $(".edit").prop('disabled', ($(".ui-selected").length != 1));
         },
     });
 })
@@ -398,5 +449,4 @@ var formToJSON = function formToJSON(elements) {
 
         return data;
     }, {});
-};
-
+};

MobiParc/index.html

@@ -95,6 +95,9 @@
             <li>
                 <a href="#activites" class="button">Ajouter</a>
             </li>
+            <li>
+                <button class="edit button" disabled>Editer</button>
+            </li>
             <li>
                 <button class="del button alt" disabled>Supprimer</button>
             </li>
@@ -155,11 +158,13 @@
                     </div>
 
                     <div class="12u$">
-                        <select id="realisation" name="realisation">
-                            <option value="13">- Type d'intervention -</option>
-                            <option value="13">Pose d'enrochements</option>
-                            <option value="16">Terrassement:déblais,remblais,tranchées</option>
-                        </select>
+                        <div class="select-wrapper">
+                            <select id="realisation" name="realisation">
+                                <option value="">- Type d'intervention -</option>
+                                <option value="13">Pose d'enrochements</option>
+                                <option value="16">Terrassement:déblais,remblais,tranchées</option>
+                            </select>
+                        </div>
                     </div>
 
                     <div class="12u$">