Applying a input mask in Rails

Question

I'm learning Rails and i'm building an admin api for my project. There's a _form.html.erb on views that i need to mask some field inputs like this one:

<div class="field">
  <%= form.label :cnpj %>
  <%= form.text_field :cnpj %>
</div>

Input value: 12345678000123
Display value during input: 12.345.678/0001-23

I have found some solutions involving js and jquery plugins, but i didn't manage to work them out (because i'm not familiar with using js/jquery plugins). What is the best way to mask these fields? Thanks in advance.

Answer 1

You're going to be using Javascript for that (vanilla, jQuery, Angular, React, etc). There are various ways to pull in a library/framework.

if the model you're using is Company then the form element Id will be 'company_cnpj'

Your element will render as

<input type="text" name="company[cnpj]" id="company_cnpj">

Depending on the library used, you can setup a basic mask with:

$(function() {
  $('#company_cnpj').inputmask({ mask: "(123) 456-7890" });
});

https://github.com/RobinHerbots/Inputmask gives you the option to pass in regex directly via a data attributes.