mberlanda/cheidelacoriera

:javascript
  $(function(){
    initializeAddGuest();
    updateFanNamesLabel();
  })

  function updateFanNamesLabel(){
    var fansCount = $('input[name="reservation[fan_names][]"]').length;
    $("label[for='reservation_fan_names']").text( "Partecipanti Aggiunti: " + fansCount)
  }

  function clearGuestInput(){
    $('input#fan_last_name').val('');
    $('input#fan_first_name').val('');
  }

  function initializeAddGuest(){
    var inputSelector = 'input[name="reservation[fan_names][]"]';
    var removeButton = $('.remove_fan_names_button');
    var wrapper = $('.reservation_fan_names');

    var addButton = $('#add-guest');
    var removeButtonHtml = '<button type="button" class="remove_fan_names_button btn btn-default"><i class="fa fa-trash-o" aria-hidden="true"></i></button>';

    var emptyInput = '<div class="form-control-inline"><input class="text optional readonly" readonly="readonly" name="reservation[fan_names][]" type="text"></div>';

    var min_field_size  = 6;
    var max_fields      = 100;

    var x = $(inputSelector).length; //initial text box count

    function guestErrorMsg(msg){
      $('#guest-error').text(msg);
    }

    function guestSuccessMsg(msg){
      $('#guest-success').text(msg);
    }

    function existingGuests(){
      var guests = [];
      $('input[name="reservation[fan_names][]"]').map(function(){ guests.push($(this).val()) });
      return guests;
    }

    function extractGuestName(){
      var guestLastName = $.trim($('input#fan_last_name').val());
      var guestFirstName = $.trim($('input#fan_first_name').val());

      if (guestLastName.length < 1) {
        guestErrorMsg("Per favore indica il Cognome del partecipante");
        return false;
      }
      else if (guestFirstName.length < 1) {
        guestErrorMsg("Per favore indica il Nome del partecipante");
        return false;
      }
      else if((guestLastName + guestFirstName).length < min_field_size){
        guestErrorMsg("Il nome di un partecipante deve essere almeno " + min_field_size + " caratteri");
        return false;
      } else {
        return guestLastName + ' | ' + guestFirstName;
      };
    }

    $(addButton).click(function(e){ //on add input button click
        resetGuestMsg();
        if(x < max_fields){ //max input box allowed
          var guestName = extractGuestName();
          if (guestName) {
            var guests = existingGuests();
            if ($.inArray(guestName, guests) < 0){
              x++; //text box increment
              $(emptyInput).appendTo(wrapper).append(removeButtonHtml);
              $(inputSelector).last().val(guestName);
              clearGuestInput();
              updateFanNamesLabel();
              guestSuccessMsg(guestName + " è stato aggiunto all'elenco dei partecipanti");
            } else {
              guestErrorMsg(guestName + " è già presente nell'elenco dei partecipanti");
              clearGuestInput();
            }
          }
        } else {
          guestErrorMsg(
            "Hai raggiunto il limite massimo di partecipanti iscrivibili a questa trasferta (" +
            max_fields + ")"
           );
        }
        return;
    });

    $(wrapper).on('click', '.remove_fan_names_button',function(){ //user click on remove text
        $(this).parent('.form-control-inline').remove();
        x--;
        updateFanNamesLabel();
    });

    function resetGuestMsg(){
      guestErrorMsg('');
      guestSuccessMsg('');
    }
  }