Bedingt für verschachteltes Attribut?

Question

Wie kann ich eine bedingte erstellen, wo, wenn der Dueler der current_user ist dann wird es die current_user Herausforderungen auflisten und wenn der Dueler ist @user dann wird es die Herausforderungen des @ Benutzer auflisten?

duels_controller

def new 
    @user = User.find(params[:challenge_daddy]) 
    @duel = Duel.new 
    @duel.duelers << Dueler.new(user_id: current_user.id, user_name: current_user.name, user_last_name: current_user.last_name) 
    @duel.duelers << Dueler.new(user_id: @user.id, user_name: @user.name, user_last_name: @user.last_name) 
    @current_user_challenges = current_user.challenges.order(:created_at) 
    @challenged_user_challenges = @user.challenges.order(:created_at) 
    respond_with(@duel) 
end 

Duelle/_form.html.erb

<%= simple_form_for(@duel) do |f| %> 
    <%= f.fields_for :duelers do |dueler| %> 
    <%= render 'dueler_fields', :f => dueler %> 
    <% end %> 
    The loser will <%= f.text_field :consequence %>. 
    <%= f.submit %> 
<% end %> 

Duelle/_dueler_fields.html.erb

<%= f.select :user_id, User.order(:name).map { |user| [user.full_name, user.id] }, include_blank: true, id: "change-challenge-options" %> will 
<%= collection_select(:dueler, :challenge_id, # @challenged_user_challenges or @current_user_challenges 
, :id, :full_challenge, include_blank: true) %> 

Wie erstelle ich eine Bedingung, so dass, wenn die :user_id ist gleich current_user dann @current_user_challenges wird in collection_select angezeigt und wenn :user_id ist gleich @user dann @challenged_user_challenges wird angezeigt?

Answer 1

Sie könnten einige Java/Kaffee-Skript hinzufügen, um dies zu tun, da es Echtzeitänderungen in das Formular bedeutet.

aktuellen Benutzer Daten hinzufügen und eine teilweise (oder zwei verschiedene collection_selects mit ids):

<%= f.select :user_id, User.order(:name).map { |user| [user.full_name, user.id] }, include_blank: true, id: "change-challenge-options", data: {current-user-id: current_user.id } %> 

hinzufügen app/assets/Javascripts/challengers.coffee

$(document).ready -> 
    userSelect = $('#change-challenge-options') 
    userSelect.on 'valuesChanged', -> 
    currentUserId = $('#current-challenge-options').data('current-user-id') 
    if(currentUserId == userSelect.val()) 
     ... show/hide the correct fields 
    else 
     ... show/hide the correct fields 
    $(window).resize   #Not necessary but makes it look nicer if the lists are long. 

Sie wissen nicht, wenn Dies ist die beste Lösung, aber ich habe etwas ähnliches in meinem Projekt getan und es funktioniert gut.

EDIT: Also erstens werden Sie brauchen collection_select Felder für beide Situationen zu Ihrer Ansicht hinzuzufügen und sie mit ids liefern:

<%= collection_select(:dueler, :challenge_id, @current_user_challenges, :id, :full_challenge, include_blank: true), id: "current-user-challenges" %> 
<%= collection_select(:dueler, :challenge_id, @challenged_user_challenges, :id, :full_challenge, include_blank: true), id: "challenged-user-challenges" %> 

dann im Skript Sie hinzufügen müssen:

if(currentUserId == userSelect.val()) 
    $('#current-user-challenges').show() 
    $('#challenged-user-challenges').hide() 
else 
    $('#challenged-user-challenges').show() 
    $('#current-user-challenges').hide() 

Dies zeigt/versteckt die richtigen Felder. Ich bin mir nicht sicher, wie IDs zu Collection_selects hinzugefügt werden, aber wenn mein Vorschlag nicht funktioniert, lege sie einfach in einen div oder anderen Container. Gib diesen Containern IDs und zeige/verstecke sie auf die gleiche Weise.

Darüber hinaus möchten Sie vielleicht ein Skript hinzufügen, das Erstbesuche oder Revisionen des Formulars richtig behandelt. So würde der vollständige Code etwas wie sein:

#page:load just makes sure the page is fully loaded before running script. 
#Usefull if you use turbolinks etc. 
$(document).on 'ready page:load' -> 
    userSelect = $('#change-challenge-options') 
    currentUserId = $('#current-challenge-options').data('current-user-id') 
    $(window).on 'page:change', -> 
    if(userSelect.val()) #All none zero values are true in js 
     if(currentUserId == userSelect.val()) #Show the right field 
     $('#current-user-challenges').show() 
     $('#challenged-user-challenges').hide() 
     else 
     $('#challenged-user-challenges').show() 
     $('#current-user-challenges').hide() 
    else         #Hide both fields if no user is chosen. 
     $('#challenged-user-challenges').hide() 
     $('#current-user-challenges').hide() 
    $(window).resize 
    userSelect.on 'valuesChanged', -> 
    if(currentUserId == userSelect.val()) 
     $('#current-user-challenges').show() 
     $('#challenged-user-challenges').hide() 
    else 
     $('#challenged-user-challenges').show() 
     $('#current-user-challenges').hide() 
    $(window).resize 

Ich hoffe, es wird für Sie arbeiten!

Hier ist ein Arbeits Ausschnitt aus dem Konzept mit Hilfe von Javascript statt Kaffee und rohe html:

var userSelect = $('#change-challenge-options'); 
 
var currentUserId = $('#current-user-id').data('user-id'); 
 
$('#challenged-user-challenges').hide(); 
 
$('#current-user-challenges').hide(); 
 
userSelect.on('change', function() { 
 
    if (userSelect.val() == "0"){ 
 
    $('#current-user-challenges').hide(); 
 
    $('#challenged-user-challenges').hide(); 
 
    } 
 
    else if (userSelect.val() == currentUserId) { 
 
    $('#current-user-challenges').show(); 
 
    $('#challenged-user-challenges').hide(); 
 
    } else { 
 
    $('#challenged-user-challenges').show(); 
 
    $('#current-user-challenges').hide(); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!DOCTYPE html> 
 
<form id="new_challenge" role="form" accept-charset="UTF-8"> 
 
    <div class="form-group" id="current-user-id" data-user-id = "1"> 
 
    <label class="control-label col-sm-2">User:</label> 
 
    <select class="form-control" name="users" id="change-challenge-options"> 
 
     <option selected="selected" value="0">Choose user...</option> 
 
     <option value="1">Me</option> 
 
     <option value="2">Other user</option> 
 
    </select> 
 
    </div> 
 
    <label class="control-label col-sm-2">Challenges:</label> 
 
    <div class="form-group"> 
 
    <select class="form-control" name="users" id="current-user-challenges"> 
 
     <option selected="selected" value="0">Choose challenge...</option> 
 
     <option value="1">My challenge 1</option> 
 
     <option value="2">My challenge 2</option> 
 
    </select> 
 
    </div> 
 
    <div class="form-group"> 
 
    <select class="form-control" name="users" id="challenged-user-challenges"> 
 
     <option selected="selected" value="0">Choose challenge...</option> 
 
     <option value="1">Other user challenge 1</option> 
 
     <option value="2">Other user challenge 2</option> 
 
     <option value="3">Other user challenge 3</option> 
 
    </select> 
 
    </div> 
 
    </div> 
 
</form>