Rails cocoon gem issue with jquery mask: new entry created every time

Question

I am using Cocoon 1.1.1 to nest phone fields for a Person model. I wanted to have a input mask for the phone number, so I included jquery.maskedinput-1.3.min.js under the javascript folder.

It seems that when I apply the mask, the parameters submitted to Rails is missing the id for the phone attributes:

 "phones_attributes"=>{"0"=>{"number"=>"214-648-4417", "label"=>"Work", "_destroy"=>"", "id"=>''}}}

This creates new entries every time. At this point, I am not adding new phone numbers, just clicking on Update.

This is my Coffee Script:

jQuery.fn.addPhoneMasks = ->
  $('input[id*="phone"]').each ->
    $(this).mask("999-999-9999?")

jQuery ->
  $('div#phones').addPhoneMasks()

(Note: I would need to use insertion callbacks to apply the mask to newly inserted phone fields, but I am not there yet :) )

Answer 1

I found my error: the mask should not use id*="phone" because the jquery plugin adds a value to the hidden fields of cocoon.

My solution is to make a class for the phone, and then use this to for the selection.