12

私は編集フォームを持っています、フォームはsymfony2フォームタイプを通して作られています。ドキュメントを確認しましたが、フォームにCSSを追加するためのオプションが見つかりませんでした。フォームにはデータが正しく表示され、各フィールドにスタイルを追加するだけで問題ありません。

私の編集タイプは

 public function buildForm(FormBuilder $builder, array $options)
{
    $builder
    ->add('id', 'hidden')
    ->add('patent_name', 'text', array('label' => 'Patent Name'))
    ->add('description', 'textarea', array('label' => 'Description', 'required' => false))
    ->add('appln_auth','text', array('label' => 'Application Authorization'))
    ;
}

誰でも私がcssを追加できる方法を知っていますか？

ありがとう

4

4 に答える 4

16

フォームを作成するときにできる方法は次のとおりです。

 $builder->add('field_name', 'text', array('label' => 'Field Label', 'attr' => array('class' => 'fieldClass')));

フォームフィールドをレンダリングするときにも実行できます。Twigテンプレートフォーム関数リファレンスをご覧ください。

{{ form_label(form.field, 'label', { 'attr': {'class': 'foo'} }) }}
{{ form_widget(form.field, { 'attr': {'class': 'bar'} }) }}

次に、バンドルのパブリックアセットにcssファイルを追加し、を使用してテンプレートで呼び出すことができます。

{% block stylesheets %}
    {% parent() %} {# if you want to keep base template's stylesheets #}
    <link href="{{ asset('bundle/myBundle/css/stylesheet.css') }}" type="text/css" rel="stylesheet" />
{% endblock %}

次に、Web/ディレクトリからパブリックアセットにアクセスできるようにする必要があります。それを行うための最良の方法は、バンドルのパブリックアセットをターゲットとするシンボリックリンクを作成することです。その後、実行します。

assets:install web/ --symlink

特定のフォームフィールドレンダリングブロック（Twig）を完全にカスタマイズする場合のもう1つの便利なアプローチは、新しいフォームテーマを定義することです。これは、ドキュメント> Twigのフォームテーマです。

于 2012-10-09T21:36:14.163 に答える
0

フィールドにクラスを追加する場合は、その方法でattrビルドフォームのaddアクションで特別な属性を使用する必要があります

$builder->add('field_name', 'yourType', array('attr' => array('class' => 'fieldClass')));

代わりにスタイルシートをリンクする場合は、アセットを使用する必要があります。
アセットの詳細については、こちらをご覧ください

アセットを操作するには、次のことを行う必要があります。

  • cssファイルを作成します
  • アセットをインストールします（キャッシュされていない限り、cssの変更を反映するオプションassets:installを使用することをお勧めします）--symlink
  • テンプレートにCSSを使用してCSSを楽しんでください。小枝の場合、あなたは< link href="{{ asset('bundles/acmebundle/css/style.css') }}" type="text/css" rel="stylesheet">（acmebundleあなたのバンドルはどこにありますか）をしなければなりません
于 2012-10-10T07:05:16.790 に答える
0

これは役立つかもしれません：

$builder->add('patent_name', 'text', array('label' => 'Patent Name', 'attr' => array('class' => 'someclass')));
于 2012-10-09T21:31:19.757 に答える
0

次のように、ChoiceTypeのCSSスタイルを追加できます。

->add('triage', DocumentType::class, [
                    'label' => 'Triage',
                    'required' => false,
                    'placeholder' => 'select',
                    'label_attr' => [
                        'class' => 'col-sm-2 control-label',
                    ],
                    'choice_attr' => function($choice, $key, $value) {
                        return ['style' => 'background:' . $choice->getColorCode().'; color:white;'];
                    },
                    'class' => 'AppBundle:TriageMaster',
                    'choice_label' => 'triage',
                ])

ここでは、CSSスタイルを選択するために選択したデータを使用しました。

于 2019-12-02T06:06:55.207 に答える