Symfony 3.4 - 带有下拉列表的表单集合

时间:2018-02-19 09:47:06

标签: symfony symfony-forms symfony-3.4

在我的symfony项目中,我有两个实体" Conducteur"和" Datevisite"与一对多的关系。

我有一个有限数量的日期访问,介于1和3之间,由下拉列表确定。

问题是我每次插入3个Datevisites,即使我只需插入一个而且我不知道该怎么做。

Conducteur entity:

class Conducteur{
    /**
     * @var Datevisite
     *
     * @ORM\OneToMany(targetEntity="PDF\RegBundle\Entity\Datevisite", mappedBy="fkConducteur", cascade="all")
     */
    private $datevisites;

    /**
     * Conducteur constructor.
     */
    public function __construct()
    {
        $this->datevisites = new ArrayCollection();
    }

    /**
     * @return \Doctrine\Common\Collections\Collection
     */
    public function getDatevisites()
    {
        return $this->datevisites;
    }

    /**
     * Add date
     * @param Datevisite $date
     * @return Conducteur
     */
    public function addDatevisite(Datevisite $date){
        $this->datevisites[] = $date;
        $date->setFkConducteur($this);

        return $this;
    }

    /**
     * remove date
     *
     * @param Datevisite $date
     */
    public function removeDatevisite(Datevisite $date){
        $this->datevisites->removeElement($date);
    }

}

Datevisite实体:

class Datevisite{

    /**
     * @var \Typedatevisite
     *
     * @ORM\ManyToOne(targetEntity="Conducteur", inversedBy="datevisites")
     * @ORM\JoinColumn(name="fk_conducteur", referencedColumnName="Co_id")
     */
    private $fkConducteur;



    /**
     * Datevisite constructor.
     * @param Conducteur $fkConducteur
     */
    public function __construct(Conducteur $Conducteur = null)
    {
        $this->fkConducteur = $Conducteur;
    }

    /**
     * Set fkConducteur
     *
     * @param Conducteur $fkConducteur
     *
     * @return Datevisite
     */
    public function setFkConducteur(Conducteur $fkConducteur)
    {
        $this->fkConducteur = $fkConducteur;

        return $this;
    }

    /**
     * Get fkConducteur
     *
     * @return Conducteur
     */
    public function getFkConducteur()
    {
        return $this->fkConducteur;
    }
}

控制器:

$conducteur = new Conducteur();    
        $em = $this->getDoctrine()->getManager();

        $formBuilder = $this->createFormBuilder($conducteur);
        $formBuilder->add('nom', TextType::class)
            ->add('prenom', TextType::class)
            ->add('societe', TextType::class)
            ->add('refGroupe', TextType::class)
            ->add('codeBillet', TextType::class)
            ->add('typeBillet', ChoiceType::class, array(
                'choices' => array('un jour' => 1, 'Deux jours' =>2, 'Trois jours' => 3), 'multiple'=> false))

            ->add('datevisites', CollectionType::class, array(
                'entry_type' => DatevisiteType::class,
                'label' => 'Date(s) de visite(s)',
                'allow_add' => true,
                'allow_delete' => true,
                'prototype' => true,
                'by_reference' => false,
            ))

            ->add('Enregistrer', SubmitType::class);

        $form = $formBuilder->getForm();

        if ($request->isMethod(Request::METHOD_POST)){
            $form->handleRequest($request);

            if ($form->isValid() && $form->isSubmitted()){
                $em->persist($conducteur);
                $em->flush();
            }

        }

        return $this->render("PDFRegBundle::Conducteur/ajout.html.twig", array('form' => $form->createView(), 'notice' => $notice));

DatevisiteType:

public function buildForm(FormBuilderInterface $builder, array $options)
    {
        $builder->add('dvVisite', DateType::class, array(
            'widget' => 'single_text',
            'format' => 'yyyy-MM-DD',
            'label' => false,
            'html5' => false,
            'label_attr' => ['class' => 'col-md-2 control-label'],
            'attr' => ['class' => 'datetimepicker dateaddinput col-md-4']
        ));
    }

我的树枝:

<!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
      <!-- Content Header (Page header) -->
      <section class="content-header">
        <h1>
                Ajout conducteur
        </h1>
      </section>

        <!-- Main content -->
      <section class="content">

        <!-- Default box -->
        <div class="box">
          <div class="box-body">
            <div class="col-md-12">
              {{ form_start(form, {'attr': {'class': 'form-horizontal'}}) }}
                {# Les erreurs générales du formulaire. #}
                {{ form_errors(form) }}

              <div class="form-group">
                  {# Génération du label. #}
                  {{ form_label(form.nom, "Nom", {'label_attr': {'class': 'col-sm-2 control-label'}}) }}

                  {# Affichage des erreurs pour ce champ précis. #}
                  {{ form_errors(form.nom) }}

                <div class="col-sm-10">
                    {# Génération de l'input. #}
                    {{ form_widget(form.nom, {'attr': {'class': 'form-control'}}) }}
                </div>
              </div>
              <div class="form-group">
                  {# Génération du label. #}
                  {{ form_label(form.prenom, "Prénom", {'label_attr': {'class': 'col-sm-2 control-label'}}) }}

                  {# Affichage des erreurs pour ce champ précis. #}
                  {{ form_errors(form.prenom) }}

                <div class="col-sm-10">
                    {# Génération de l'input. #}
                    {{ form_widget(form.prenom, {'attr': {'class': 'form-control'}}) }}
                </div>
              </div>
              <div class="form-group">
                  {# Génération du label. #}
                  {{ form_label(form.societe, "Société", {'label_attr': {'class': 'col-sm-2 control-label'}}) }}

                  {# Affichage des erreurs pour ce champ précis. #}
                  {{ form_errors(form.societe) }}

                <div class="col-sm-10">
                    {# Génération de l'input. #}
                    {{ form_widget(form.societe, {'attr': {'class': 'form-control'}}) }}
                </div>
              </div>
              <div class="form-group">
                  {# Génération du label. #}
                  {{ form_label(form.refGroupe, "Référence groupe", {'label_attr': {'class': 'col-sm-2 control-label'}}) }}

                  {# Affichage des erreurs pour ce champ précis. #}
                  {{ form_errors(form.refGroupe) }}

                <div class="col-sm-10">
                    {# Génération de l'input. #}
                    {{ form_widget(form.refGroupe, {'attr': {'class': 'form-control'}}) }}
                </div>
              </div>
              <div class="form-group">
                  {# Génération du label. #}
                  {{ form_label(form.codeBillet, "Code billet", {'label_attr': {'class': 'col-sm-2 control-label'}}) }}

                  {# Affichage des erreurs pour ce champ précis. #}
                  {{ form_errors(form.codeBillet) }}

                <div class="col-sm-10">
                    {# Génération de l'input. #}
                    {{ form_widget(form.codeBillet, {'attr': {'class': 'form-control'}}) }}
                </div>
              </div>
              <div class="form-group">
                  {# Génération du label. #}
                  {{ form_label(form.typeBillet, "Type de billet", {'label_attr': {'class': 'col-sm-2 control-label'}}) }}

                  {# Affichage des erreurs pour ce champ précis. #}
                  {{ form_errors(form.typeBillet) }}

                <div class="col-sm-10">
                    {# Génération de l'input. #}
                    {{ form_widget(form.typeBillet, {'attr': {'class': 'form-control'}}) }}
                </div>
              </div>
                    {{ form_row(form.datevisites, {'attr': {'class': 'test'}}) }}


              {{ form_widget(form.Enregistrer, {'attr': {'class': 'btn btn_primary'}}) }}

              {{ form_end(form) }}
            </div>
          </div>
        </div>
          <!-- /.box-body -->


      </section>
      <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->

    <footer class="main-footer">
    </footer>
    <!-- /.control-sidebar -->
    <!-- Add the sidebar's background. This div must be placed
         immediately after the control sidebar -->
    <div class="control-sidebar-bg"></div>
  </div>
  <!-- ./wrapper -->

{% endblock %}

{% block javascripts %}
  <script type="text/javascript">
      $(document).ready(function () {

          $('.sidebar-menu').tree();

          var $container = $('div#form_datevisites');

              for ( var i = 0; i < 3; i++){
                  var template = $container.attr('data-prototype')
                      .replace(/__name__label__/g, 'Date n°' + (i+1))
                      .replace(/__name__/g,        i)
                  ;
                  var $prototype = $(template);
                  $container.append($prototype);
              }

          $('#form_datevisites > .form-group').get(1).style.display = "none";
          $('#form_datevisites > .form-group').get(2).style.display = "none";

          console.log($(':input[id^="form_datevisites_0_dvVisite"]').value = null);


          $('#form_typeBillet').on('change', function () {
              console.log(this.value);
              if( this.value == 1){
                  $('#form_datevisites > .form-group').get(1).style.display = "none";
                  $('#form_datevisites > .form-group').get(2).style.display = "none";
              }else{
                  if(this.value == 2){
                      $('#form_datevisites > .form-group').get(1).style.display = "block";
                      $('#form_datevisites > .form-group').get(2).style.display = "none";
                  }else{
                      $('#form_datevisites > .form-group').get(1).style.display = "block";
                      $('#form_datevisites > .form-group').get(2).style.display = "block";
                  }
              }
          });


          $(function () {
              $('#form_datevisites_0_dvVisite').datetimepicker({
                  format: 'YYYY-MM-DD',
                  locale: 'fr',
                  minDate: moment().millisecond(0).second(0).minute(0).hour(0),
                  defaultDate: moment(),
              });
          });

          $(function () {
              $('#form_datevisites_1_dvVisite').datetimepicker({
                  format: 'YYYY-MM-DD',
                  locale: 'fr',
                  minDate: moment().add('days', 1).millisecond(0).second(0).minute(0).hour(0),
              });
          });

          $(function () {
              $('#form_datevisites_2_dvVisite').datetimepicker({
                  format: 'YYYY-MM-DD',
                  locale: 'fr',
                  minDate: moment().add('days', 2).millisecond(0).second(0).minute(0).hour(0),
              });
          });

          $(function () {
              $('.datetimepicker').datetimepicker({
                  format: 'YYYY-MM-DD',
                  locale: 'fr',
              });
          });
      })
  </script>

如何根据用户的选择添加正确数量的Datevisite?

1 个答案:

答案 0 :(得分:0)

检查您的HTML代码,您将看到您的三个表单存在但隐藏。你不应该使用“display:none”而是使用jquery函数“remove”。

您可以在symfony documentation

中做一个很好的例子