Loading...
 

No Food for Thought

FHoS - Igor Escobar and the jQuery Mask Plugin

admin Monday March 7, 2016

Designing Web forms can still be a pain today. I thought HTML version 5 and its tel type input field could replace the complicated triple text fields used by our web tools. But due to lacking global phone number standardization, tel is quite useless. So I ended up integrating the jQuery Mask Plugin, which adds characters in a plain text field so "1234567890" is turned into "(123) 456-7890", or the format you want ("(000) 000-0000" is called a mask).

Everything seemed fine until I realized the plugin was pushing the masked values to the server. If the server had pushed a customer's current phone number as "1234567890", which was then masked by the plugin, it would come back to the server as "(123) 456-7890". In August 2015, raphaelm22 requested his solution to be adopted. Igor Escobar, the jQuery Mask Plugin's author, commented that he appreciated the "suggestion but [did not] belieave that [raphaelm22's] decision matches with what [he hoped] in terms of future of jQuery Mask." And without further explanation, he closed the ticket.

I took that occasion to properly report the problem raphaelm22 was trying to solve in ticket #371. And 2 days ago, Igor Escobar closed that ticket, without any explanation.

Dear Igor, if you read this, I am thankful to you for writing the plugin, but for authoring such a bug and for pretending it does not exist… I am hereby enshrining you into the infamous FHoS.

As always, admission into the FHoS is best considered as an incitation to leave it. In this case, you will have yourself expelled from the Hall by simply solving this issue, either by a code fix or by properly documenting it. I do hope your solution will be better than that proposed by raphaelm22.

Meanwhile, we are using the following ugly workaround at work, similar to raphaelm22's suggestion:

jQuery("form").submit(function() {
      jQuery('input.telephone').each(function() {
            jQuery(this).val(jQuery(this).cleanVal());
            });
      });


If you know of a fork without this issue or an equivalent plugin, please leave a comment to let me know.

TODO: Evaluate https://github.com/digitalBush/jquery.maskedinput
See also http://wiki.jqueryui.com/w/page/12137996/Mask

Newest Blog Posts