slider age sur le catalogue des jeux

scripts/201512180630_create_table_reservations.sql

@@ -2,8 +2,10 @@ CREATE TABLE `reservations` (
   `id` int(11) NOT NULL AUTO_INCREMENT,
   `game_id` int(11) DEFAULT NULL,
   `member_id` int(11) DEFAULT NULL,
+  `reservation_date` date DEFAULT NULL,
+  `available` int(1) NOT NULL DEFAULT '0',
   `created_at` datetime NOT NULL,
-  `updated_date` datetime NOT NULL,
+  `updated_at` datetime NOT NULL,
   PRIMARY KEY (`id`)
 ) ENGINE=InnoDB DEFAULT CHARSET=utf8;
 

views/games/list.html

@@ -16,10 +16,12 @@
 
   </div>
   <div class="panel-body">
-      Interval d'age
+      <div id="slider_div">
+      Age : 
       <b>3</b> 
-        <input id="age_range" type="text" class="span2" value="" data-slider-min="3" data-slider-max="99" data-slider-step="5" data-slider-value="[3,20]"/> 
+        <input id="age_range" type="text" data-slider-min="0" data-slider-max="20" data-slider-step="1" data-slider-value="10"/>
       <b>99</b>
+      </div>
 
 <div class="col-sm-12" align="center">
 <table id="list_games" style="display:none"> 
@@ -61,14 +63,20 @@
 </div>
 <script>
 $(document).ready(function() {
+    var age_slider = $('#age_range').slider({})
+        .on("change", function(obj) {
+            //console.log(obj);
+            table.draw();
+        });
     $.fn.dataTable.ext.search.push(
         function( settings, data, dataIndex ) {
-            var min = parseInt( $('#age_range').getValue()[0], 10 );
-            var max = parseInt( $('#age_range').getValue()[1], 10 );
+            //var min = parseInt( $('#age_range').getValue()[0], 10 );
+            //var max = parseInt( $('#age_range').getValue()[1], 10 );
+            var age = age_slider.slider('getValue');
             var min_age = parseInt( data[1] ) || 0; // use data for the age column
             var max_age = parseInt( data[2] ) || 0; // use data for the age column
      
-            if ( max_age < max || min_age > min ) {
+            if ( age >= min_age && age <= max_age ) {
                 return true;
             }
             return false;
@@ -78,17 +86,17 @@ $(document).ready(function() {
 		"autoWidth": false,
         "fnDrawCallback": function() {
            $(this).show();
-        }
+        },
+        "language": {
+            "url": "js/dataTables.french.json"
+        },
+        "dom": '<"slider_div">frtip'
     });
     $('#new_button').click(function(){
 		$('#a').val('new');
 		defaultform.submit();
     });
-    $("#age_range").slider({})
-        .on("change", function(obj) {
-            //console.log(obj);
-            table.draw();
-        });
+
 });
 /* FIXME : translation of the table
 see https://datatables.net/plug-ins/i18n/French