Lorsque l’on à un dataTable sur une vue et que l’on veux cliquer sur une ligne du tableau pour déplier cette ligne et y voir de nouvelles informations, cela peut devenir compliqué et l’on peux vite faire du code pas très propre.

DataTables propose une api, rowChild pour pouvoir créer des sous tableaux dans un table de manière moins sale.

function format ( d ) {
    // `d` is the original data object for the row
    return '<table cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">'+
        '<tr>'+
            '<td>Entretiens:</td>'+
            '<td>'+d[1]+'</td>'+
        '</tr>'
    '</table>';
}

La fonction format permet de passer l’objet ( une ligne du tableau ) et ainsi de recréer un tableau en allant rechercher les informations que l’on veux afficher dans un tableau javascript.

$(document).ready(function() {
  var table = $('.table').DataTable( {
      "iDisplayLength": 100,
      'oLanguage': {
          'oPaginate': {
              'sPrevious': 'Page précédente',
              'sNext': 'Page suivante',
              'sLast': 'Dernière page',
              'sFirst': 'Première page',
          },
         'sInfoEmpty': 'Aucune infos à afficher',
         'sInfo': '_TOTAL_ iinfos à afficher (_START_ à _END_)',
         'sEmptyTable': 'Aucune infos à afficher',
         'sInfoFiltered': ' - filtrées de _MAX_ enregistrements',
         'sLengthMenu': 'Afficher _MENU_ infos',
         'sSearch': 'Recherche :',
         'sZeroRecords': 'Aucun résultat pour cette recherche'
      },
        responsive: {
            details: {
                type: 'column',
                target: 'tr'
            }
        },
        columnDefs: [ {
            className: 'control',
            orderable: false,
            targets:   0
        }
 
 
         ],
        order: [ 1, 'asc' ]
  });

Dans le document.ready il faut ajouter une classe pour cibler une colonne, ici « control » qui va permettre de gérer l’affichage au clic

  $('.table tbody').on('click', 'td.control', function () {
      var tr = $(this).closest('tr');
      var row = table.row( tr );
 
      if ( row.child.isShown() ) {
          // This row is already open - close it
          row.child.hide();
          tr.removeClass('shown');
      }
      else {
          // Open this row
          row.child( format(row.data()) ).show();
          tr.addClass('shown');
      }
  });

Il faut aussi bien penser à ajouter bootstrap.js et jquery pour que cela fonctionne.

source : DatatTable

Pour améliorer la vitesse de precompile d’un projet il est possible d’utiliser la gem Turbo-sp-rocket-rails3

Cette Gem a pour but d’améliorer la vitesse de precompile d’un projet.

Installation

pour installer cette Gem il suffit de l’inclure dans le Gem file dans le groupe asset de cette manière

group :assets do
  gem 'turbo-sprockets-rails3'
end

Ensuite il est nécessaire de faire un bundle install, puis de lancer un rake assets:precompile.

Utilisation

le premier rake assets:precompile peut être lent, mais ceci est normal. La gem va créer un fichier manifest.yml dans le dossier public/assets

Ce fichier contient la source de tout les assets du projet. Seuls les assets modifiés seront precompilé et non plus la totalité lors d’un commit.

Quelque chiffre : sur un projet sans la gem 53 secondes lors du push. Avec la gem 12 secondes. le gain de temps est non négligeable.

Rails 5 ?

Avec l’apparition de Rails 5  il est nécessaire d’upgrader sprocket en version 4 qui apporte de gros changements dans la compilation des assets.

En effet dans les version précédentes on utiliser le fichier config/initializer/assets.rb pour indiquer quels assets devaient être precompilé.

Avec Sprocket 4 il est possible d’utiliser le manifest.js dans le dossier app/assets/

Utilisation

Comment utiliser ce nouveau fichier ? Il faut créer le fichier manifest.js dans app/assets/config/ (créer le dossier config s’il n’est pas présent).

Dans le manifest.js on va pouvoir relier nos répertoire JS CSS et bien d’autres.

// JS and CSS bundles
//
//= link_directory ../javascripts .js
//= link_directory ../stylesheets .css
 
// Images, fonts etc ...
//
//= link_tree ../fonts
//= link_tree ../images

Ceci étant terminé il est nécessaire de retirer le config.assets.precompile du fichier config/initializers/assets.rb.

source : eileencodes, turbo-sprocket-rails3

En rails il existe plusieurs méthodes pour savoir quel est le contrôleur actif de la page.

La première est de comparer le params[:controller] à une string :

 params[:controller] == "contact"

Mais, utiliser un params dans une vue n’est pas une bonne pratique.

Deux solutions s’offrent donc a nous :

1. controller_name
2. current_page

le controller_name s’utilise de cette façon :

 controller_name == "contact"

Et le helper methode current_page s’utilise de cette manière :

 current_page?(controller: "contact")

Quelle est la meilleure pratique entre les deux ? Le current_page me semble le mieux  car il permet de faire un peu plus de choses si besoin.

En effet le current_page peut prendre plusieurs options comme l’action, l’ordre ou même la pagination. Il peut aussi prendre une string, à la place d’un symbole.

Sources : doc current_page?, doc controller_name

Quand on créer un validateur on écrit par exemple :

validates_presence_of :password, message: "Ce champ est obligatoire."

qui permet la validation sur toutes les actions.

Mais on peut préciser l’action sur lequel on souhaite appliquer le validateur :

validates_presence_of :password, message: "Ce champ est obligatoire.", on: :create

Ici, on vérifie la présence du champs password que lors du create et pas du tout lors de l’update.

à l’inverse on peut vérifier la présence du champs que lors de l’update.

validates_presence_of :password, message: "Ce champ est obligatoire.", on: :update

Précision sur l’utilisation de Bcrypt :

L’utilisation de cette gem nécessite de mettre dans le model de notre objet la ligne suivante :

has_secure_password

Le has_secure_password  valide la  presence  du password et du password_confirmation. Il vérifie aussi si les mots de passe sont les mêmes.

si l’on souhaite désactiver ces validateurs il faut passer validations: false en argument

has_secure_password validations: false

et de faire les validateurs de la manière classiques.

si maintenant on souhaite ajouter un nombre de caractère minimum sur le mot de passe il faut garder le has_secure_password et ajouter un validate supplémentaire comme suis  :

has_secure_password
validates :password, length: { minimum: 6 }, if: lambda { self.password.present? }

Le validate permet de vérifier si le mot de passe fait 6 caractères minimum si et seulement si l’utilisateur change son mot de passe.