Autonomiczne szyny użytkownika Obiekt użytkownika

Question

W mojej aplikacji użytkownicy należą do grupy i odbywa się to w moim Modelu grupy użytkowników.

class Usergroup < ApplicationRecord 
    belongs_to :user 
    belongs_to :group 
end 

class User < ApplicationRecord 
    has_many :usergroups 
    has_many :groups, through: :usergroups 
end 

class Group < ApplicationRecord 
    has_many :usergroups 
    has_many :users, through: :usergroups 
end 

Gdy chcę dodać user do group chociaż muszę znać identyfikator group i identyfikator user co jest dalekie od ideału. Stworzyłem pole autouzupełniania używając jQuery, aby zająć się tym dla mnie.

<%= form_with(model: usergroup, local: true) do |form| %> 

    <div class="field"> 
    <%= form.label :user_id %> 
    <%= form.text_field :user_id, id: 'user', data: { autocomplete_source: User.order(:email).map(&:email) } %> 
    </div> 

    <%= form.submit %> 
<% end %> 

Gdy próbuję utworzyć nową usergroup z elektroniczną I wybranego z menu rozwijanego to zgłaszającej bo to wymagająca tam być użytkownikiem. Jak przekazać pełny obiekt użytkownika do tego pola zamiast tylko e-maila użytkownika, który chcę utworzyć? Czy podchodzę do tego prawidłowo?

Jest to trasa wykorzystywana do pozyskiwania użytkowników.

user GET /users/:id(.:format)  users#index 

Answer 1

Kiedy muszę znaleźć wartość z dużą listę Lubię używać GEM "select2-rails" gem

można dokonać kod Ajax, aby uzyskać wartości jak ten

class UserController < ApplicationController 
    respond_to :html, :json 

    def index 
    if params[:email].present? 
     @users = User.where(email: params[:email]) 
    else 
     @users = User.all 
    end 
    respond_with @users 
    end 
end 

w twojej HTML - wszystko, czego potrzebujesz:

<div class="field"> 
    <%= form.label :user_id %> 
    <%= form.hidden_field :user_id, id: 'user_id', class: 'select2' %> 
</div> 

oraz w Twoim JS

$(document).ready(function() { 
    $('.select2').select2({ 
    ajax: { 
     url: "<%= user_path(format: :json) %>", 
     dataType: "json", 
     results: function(data, page) { 
     return { 
      results: $.map(data, function(user, i) { 
      return { id: user.id, text: user.email } 
      }) 
     } 
     } 
    } 
    }); 
}); 

Mam nadzieję, że to działa dla Ciebie lub punktów we właściwym kierunku

Answer 2

Zazwyczaj gdy masz autouzupełniania, który chcesz użyć wybierz pole do tego. Jedną z zalet pola wyboru jest możliwość wyświetlenia jednej wartości, a wybór spowoduje przesłanie innej. Jest to idealne rozwiązanie do sytuacji, w której użytkownik chce wybrać wiadomość e-mail, ale faktycznie chce otrzymać stronę serwera identyfikatora.

<%= form.collection_select :user_id, User.order(:email), :id, :email %> 

Możesz zawinąć zaznaczenie w ten sposób przy pomocy bibliotek takich jak Selectize lub Select2, aby wyświetlić rozwijany styl autouzupełniania.

Wierzę, że biblioteka autouzupełniania jQuery również by do tego działała, ale nie jestem do końca zaznajomiony z nią. Wygląda to tak, jak chcesz, gdzie każdy element jest obiektem z wartością i etykietą. https://jqueryui.com/autocomplete/#custom-data

Może wyglądać tak w istniejącym JS, który ładuje atrybut autocomplete_source, ale nie gwarantuje, że to zadziała.

<%= form.collection_select :user_id, User.order(:email), :id, :email, data: { autocomplete_source: User.order(:email).map{ |u| { value: u.id, label: u.email } } %>