Автозаполнение JQuery/проверка оператора if/else с помощью ruby ​​on rails

Мне сложно разобраться в сложном вопросе. Вот чего я пытаюсь достичь:

Я хотел бы иметь text_field, где пользователь вводит адрес электронной почты человека, которого они хотели бы добавить, и Rails проверяет, зарегистрирован ли этот адрес электронной почты. Если это электронное письмо зарегистрировано (и учетная запись существует), оно будет отображаться из A и отправлять электронное письмо «присоединиться к проекту», если электронное письмо не совпадает с одним в базе данных (пользователь не существует), он будет отображать другую форму, форму B и отправьте электронное письмо с приглашением на SITE.

У меня сейчас функции работают отдельно. Один для приглашения существующих пользователей и один для приглашения новых пользователей. Вот что у меня есть.

Посмотреть:

= button_to_function 'Add Existing User', 'insert_add_existing_member_form()', :class => "submit"
= button_to_function 'Add New User', 'insert_invitation_membership_form()', :class => "floatright submit"      


#add_existing_member_form.template.hide
  .label_top
    = label_tag 'Enter email address or name'
    = text_field_tag 'new_member_email', "", :class => "existing_member_autocomplete"

#membership_form.template.hide
  %p Pending acceptance.
  = f.fields_for(:memberships, Membership.new(), :child_index => 'new_membership') do |ff|
    = render 'membership', :ff => ff

Приложение.js:

var insert_add_existing_member_form = function(){
  $('#membership_form_footer').before("<h2>Add Existing User</h2>")
  var template = $("#add_existing_member_form").clone()
  $("#membership_form_footer").before( template.html() )
  $('.existing_member_autocomplete').autocomplete({ 
        source: users_for_autocomplete,
    select: function(event, ui){
      insert_membership_form(ui.item)
    }
  })
}

var insert_membership_form = function(item){
   $('#membership_form_footer').before("<h2>"+item.label+"</h2>")
   var template = $('#membership_form').clone()
   $(template).find('#project_memberships_attributes_new_membership_user_id').val(item.id)
   $('#membership_form_footer').before( template.html().replace(/new_membership/g, new Date().getTime()) )
}

var insert_invitation_membership_form = function(){
  $('#membership_form_footer').before("<h2>Add New User</h2>")
  var template = $("#invitation_membership_form").clone()
  $("#membership_form_footer").before( template.html().replace(/new_membership/g, new Date().getTime()) )
}

контроллер:

@users_for_autocomplete = User.not_member_of(@project.id).to_json(:only => :id, :methods => :label)

Есть ли способ запустить оператор if / else в функции insert_membership_form(), чтобы, если пользовательский ввод не совпадает ни с одной из записей, вместо рендеринга insert_membership_form с записью пользовательского интерфейса он вставлял членство с приглашением?

В качестве альтернативы, есть ли более простой способ проверить наличие :email без использования jQuery? Я имею в виду, есть ли способ написать этот код в рельсах, чтобы пользователь просто вводил электронное письмо, он проверял, существует ли он, если true, он отображает существующий член для, если false, он отображает форму нового члена? Ваша помощь будет принята с благодарностью!

Спасибо за помощь и время!!


person slovak_100    schedule 12.01.2012    source источник
comment
спасибо за вопрос ... добавил это к вопросу выше   -  person slovak_100    schedule 13.01.2012


Ответы (1)


Ваша первая проблема заключается в том, что обратный вызов select не будет вызываться, если они не выберут элемент из автозаполнения. полный список:

select
Запускается при выборе элемента в меню...

Пользователь может ввести что-то без вызова select различными способами, например:

  • Они вводят что-то, чего нет в списке автозаполнения.
  • Они вводят то, что находится в списке автозаполнения, но набирают все целиком. Точно так же можно вставить значение, которое случайно оказалось в списке.

Таким образом, вы не можете полагаться на то, что select сделает что-то полезное. Если вы оберните свой ввод в <form>, вы можете привязать что-то к событию отправки формы, а затем люди могут нажать Enter, чтобы активировать что-то, а ваш обработчик отправки может сравнить значение ввода с вашим массивом users_for_autocomplete, чтобы увидеть, если они выбрали известное значение; вы также можете направить событие select на ту же функцию. Что-то вроде этого:

<form>
    <input>
</form>

а также:

$('input').autocomplete({
    source: users_for_autocomplete,
    select: function(event, ui) {
        choose_value(ui.item.value);
    }
});
$('form').submit(function() {
    $('input').blur();
    choose_value($('input').val());
    return false;
});
function choose_value(v) {
    for(var i = 0; i < users_for_autocomplete.length; ++i)
        if(users_for_autocomplete[i] == v)
            break;
    if(i == users_for_autocomplete.length) {
        // They entered a new one, go to insert_invitation_membership_form().
        insert_invitation_membership_form(v);
    }
    else {
        // They chose an existing one, go to insert_membership_form().
        insert_membership_form(v);
    }
}

Демонстрация общей техники: http://jsfiddle.net/ambiguous/QCHvW/

person mu is too short    schedule 13.01.2012
comment
Му, во-первых... Я просто хочу искренне поблагодарить тебя за помощь! Я следую вашему коду, и это имеет смысл; однако я не могу реализовать это в своем представлении рельсов. Я добавил js в файл application.js и попытался добавить поле формы/ввода в представление; однако он ничего не запускает - он не отображает возможные совпадения с массивом и не отвечает, когда я нажимаю ввод. Может ли это быть из-за того, что мы передаем переменную в метод insert_membership_form(), но форма не ожидает передачи значения? Ваша помощь искренне приветствуется. И еще раз большое спасибо! - person slovak_100; 15.01.2012
comment
@slovak_100: вы настроили JavaScript так, чтобы он соответствовал вашему HTML? Я не очень хорошо разбираюсь в HAML, поэтому, возможно, вы могли бы настроить HTML-версию и свой JavaScript на jsfiddle.net или аналогичном, чтобы я мог на это взглянуть. - person mu is too short; 15.01.2012
comment
еще раз я так благодарен за вашу готовность помочь. Я добавил код, и он доступен по этой ссылке: jsfiddle.net/ambiguous/QCHvW - person slovak_100; 15.01.2012
comment
Я не добавлял массив, поскольку он запускается через контроллер, поэтому я просто сделал импровизированный источник, используя ваш предыдущий пример. Еще раз, я хотел бы поблагодарить вас за то, что предложили помощь - это значит тонну. - person slovak_100; 15.01.2012
comment
@ slovak_100: Я думаю, вы забыли сохранить изменения в скрипке. - person mu is too short; 16.01.2012