如何使用ERB将类添加到选择下拉循环

时间:2016-09-17 18:34:35

标签: html css ruby-on-rails ruby-on-rails-4 erb

我有以下循环使用ERB创建选择下拉列表。它工作正常。

  <%= f.select(:player_id) do %>
    <% @players.each do |p| %>
      <%= content_tag(:option, "#{p.first_name} #{p.last_name}", value: p.id) %>
    <% end %>
  <% end %>

我的问题是如何在select元素中添加一个类?

我尝试了以下内容:

<%= f.select(:player_id), class: "form-control" do %>
    <% @players.each do |p| %>
      <%= content_tag(:option, "#{p.first_name} #{p.last_name}", value: p.id) %>
    <% end %>
<% end %>

<%= f.select(:player_id), { class: "form-control" } do %>
    <% @players.each do |p| %>
      <%= content_tag(:option, "#{p.first_name} #{p.last_name}", value: p.id) %>
    <% end %>
<% end %>

我见过与此类似的问题,但没有一个像上面的例子一样使用循环。

3 个答案:

答案 0 :(得分:1)

这应该适合你。

<%= f.select :player_id, options_for_select( @players.collect { |player| ["#{player.first_name} #{player.last_name}", player.id] } ), class: 'form-control' %>

答案 1 :(得分:1)

这就是我最终做的事情:

<%= f.select :player_id, options_for_select( @players.collect { |player| ["#{player.first_name} #{player.last_name}", player.id] } ), {}, { class: 'form-control' } %>

答案 2 :(得分:1)

我认为您的代码问题是:player_id

您只使用一个参数<%= f.select :player_id, class: "form-control" do %> <% @players.each do |p| %> <%= content_tag(:option, "#{p.first_name} #{p.last_name}", value: p.id) %> <% end %> <% end %> 调用select方法。所以你可以传递这样的其他选项。

   package com.example.dell.optasia;

import android.app.ActivityManager;
import android.content.ComponentName;
import android.content.Context;
import android.content.Intent;
import android.graphics.Color;
import android.graphics.drawable.ColorDrawable;
import android.media.MediaPlayer;
import android.speech.tts.TextToSpeech;
import android.support.v4.view.GestureDetectorCompat;
import android.support.v7.app.ActionBar;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.GestureDetector;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.MotionEvent;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;
import android.widget.ViewSwitcher;
import static android.view.GestureDetector.*;
import org.w3c.dom.Text;

import java.util.List;

public class Help extends AppCompatActivity implements
        OnGestureListener, OnDoubleTapListener {
    private GestureDetectorCompat GestureDetect;
    public MediaPlayer mp1;
    TextView textView;
    TextView answer5;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_help);
        mp1 = MediaPlayer.create(Help.this, R.raw.help);
        mp1.start();
        ActionBar ab = getSupportActionBar(); //Actionbar
        ab.setLogo(R.mipmap.iconlaunch);
        ab.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT)); // set your desired color

        ab.setDisplayUseLogoEnabled(true); //shows logo
        ab.setDisplayShowHomeEnabled(true); //shows home page
        TextView textView= (TextView) findViewById(R.id.textView);

        GestureDetect = new GestureDetectorCompat(this, this);
        GestureDetect.setOnDoubleTapListener(this);

        TextView txtview = (TextView) findViewById(R.id.question1);
        final TextView answer1 = (TextView) findViewById(R.id.answer1);

                txtview.setOnClickListener(new View.OnClickListener()
                {
                    @Override
                    public void onClick(View v) {
                        if (answer1.getVisibility() == View.VISIBLE)
                            answer1.setVisibility(View.GONE);
                        else
                        answer1.setVisibility(View.VISIBLE);
                    }

                });

        TextView txtview1 = (TextView) findViewById(R.id.question2);
        final TextView answer2 = (TextView) findViewById(R.id.answer2);
                txtview1.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v){
                        if (answer2.getVisibility() == View.VISIBLE)
                            answer2.setVisibility(View.GONE);
                        else
                            answer2.setVisibility(View.VISIBLE);
                        }
                });
        TextView txtview2 = (TextView) findViewById(R.id.question3);
        final TextView answer3 = (TextView) findViewById(R.id.answer3);
                txtview2.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        if (answer3.getVisibility() == View.VISIBLE)
                            answer3.setVisibility(View.GONE);
                        else
                        answer3.setVisibility(View.VISIBLE);
                    }
                });
        TextView txtview3 = (TextView) findViewById(R.id.question4);
        final TextView answer4 = (TextView) findViewById(R.id.answer4);

        txtview3.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        if (answer4.getVisibility() == View.VISIBLE)
                            answer4.setVisibility(View.GONE);
                        else
                        answer4.setVisibility(View.VISIBLE);
                    }
                });

        TextView txtview4 = (TextView) findViewById(R.id.question5);
        final TextView answer5 = (TextView) findViewById(R.id.answer5);
                txtview4.setOnClickListener(new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        if (answer5.getVisibility() == View.VISIBLE)
                            answer5.setVisibility(View.GONE);
                        else
                        answer5.setVisibility(View.VISIBLE);
                    }
                });



    }

    //for the overflow actionbar

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        MenuInflater menuInflater = getMenuInflater();
        menuInflater.inflate(R.menu.main_activity_menu, menu);
        return super.onCreateOptionsMenu(menu);
    }

    //for the actionbar menu items
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {

        switch (item.getItemId()) {
            case R.id.Play_ID:
                mp1 = MediaPlayer.create(Help.this, R.raw.manual);
                mp1.start();
                break;
            case R.id.Help_ID:
                startActivity(new Intent(Help.this, Help.class));
                break;
            case R.id.About_ID: {
                startActivity(new Intent(Help.this, LocationMain.class));
                return true;
            }
            case R.id.Contact_Us:{
                startActivity(new Intent(Help.this, ContactUs.class));
                return true;
            }
            case android.R.id.home:{
                startActivity(new Intent(Help.this, HomeScreen.class));
                return true;
            }
            default:
                return super.onOptionsItemSelected(item);
        }
        return false;
    }
    //calls event for the gestures
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        GestureDetect.onTouchEvent(event);
        return super.onTouchEvent(event);
    }
    @Override
    public boolean onDoubleTap(MotionEvent motionEvent) {
        return false;
    }

    @Override
    public boolean onSingleTapConfirmed(MotionEvent motionEvent) {
        return false;
    }

    @Override
    public boolean onDoubleTapEvent(MotionEvent motionEvent) {
        if(mp1!=null)
        {
            mp1.stop();
        } return false;
    }

    @Override
    public boolean onDown(MotionEvent motionEvent) {
        return false;
    }

    @Override
    public void onShowPress(MotionEvent motionEvent) {

    }

    @Override
    public boolean onSingleTapUp(MotionEvent motionEvent) {
        return false;
    }

    @Override
    public boolean onScroll(MotionEvent motionEvent, MotionEvent motionEvent1, float v, float v1) {
        return false;
    }

    @Override
    public void onLongPress(MotionEvent motionEvent) {

        Toast.makeText(Help.this, "longpress!", Toast.LENGTH_LONG).show();

    }

    @Override
    public boolean onFling(MotionEvent motionEvent, MotionEvent motionEvent1, float v, float v1) {
        return false;
    }

}