0

我正在尝试使用 Symfony2 进行嵌入多种表单的技巧。我已按照The Book - collection Field TypeThe Cookbook - How to Embed a Collection of Forms中的说明进行操作,但似乎无法正常工作。

我认为部分问题是我对 javascript 或 JQuery 不是很熟悉,并且这些说明假设完全理解(例如“为了简单起见,我们将使用 jQuery 并假设您将其包含在页面的某个位置。”)。另外,我需要用 php 而不是 twig 编写我的模板,而且我还没有找到使用 php 模板完成的示例。

这是我到目前为止所做的......

我的主要表单类:

class StudyType extends AbstractType
{
    public function buildForm(FormBuilder $builder, array $options)
    {
        $builder
            ->add('studyName', null, array('label'=> 'Study Name:'))
            ->add('participants', 'collection', array(
            'type'=> new ParticipantType(), 
            'allow_add'=>true,
            'by_reference'=>false
         ));
}

public function getName()
{
    return 'study';
}

public function getDefaultOptions(array $options) 
{
  return array(
      'data_class' => 'MyBundle\Entity\Study',
  );
}

我的嵌入式表单类:

class ParticipantType extends AbstractType
{
    public function buildForm(FormBuilder $builder, array $options)
    {
    $builder
        ->add('participantId','text', array('label'=>'Participant ID'))
        ->add('dOB', 'date', array(
            'label'=>'D.O.B.', 
            'years'=>range(date('Y'), 1932),
            'required'=>false
         ))
        ->add('gender', 'choice', array(
            'label'=>'Gender',
            'choices'=>array('F'=>'F', 'M'=>'M'),
            'required'=>false
        ))
        ->add('dateEnteredStudy', 'date', array(
            'label'=>'Date entered trial', 
            'years'=>range(date('Y'), 1990),
            'required'=>false
        ))
        ->add('dateCompletedStudy', 'date', array(
            'label'=>'Date completed trial', 
            'years'=>range(date('Y'), 1990),
            'required'=>false
        ))
        ;
    }

    public function getName()
    {
        return 'participant';
    }

    public function getDefaultOptions(array $options) 
    {
      return array(
          'data_class' => 'MyBundle\Entity\Participant',
      );
    }
}    

我的 base.html.php 模板:

<!DOCTYPE html>
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <title><?php $view['slots']->output('title', 'My title') ?></title>
    <?php $view['slots']->output('stylesheets') ?>
    <link rel="shortcut icon" href="<?php echo $view['assets']->getUrl('favicon.ico') ?>" />
</head>
<body>
    <?php $view['slots']->start('mainMenu')  ?>
        <!--lots of menu items here -->
    <?php $view['slots']->stop() ?>

    <?php $view['slots']->start('javascripts') ?>
        <script src="<?php echo $view['assets']->getUrl('/js/jquery-1.7.1.js') ?>" type="text/javascript"></script>
    <?php $view['slots']->stop() ?>

    <?php $view['slots']->output('mainMenu') ?>
    <?php $view['slots']->output('body') ?>
    <?php $view['slots']->output('javascripts') ?>
</body>

我的 study.html.php 模板:

 <?php $view->extend('MyBundle::base.html.php') ?>

    <?php $view['slots']->start('body') ?>
        <form action="<?php echo $view['router']->generate('study', array('id'=>$entity->getId()))?>" method="post" <?php echo $view['form']->enctype($form) ?>>
    <ul id="multi-participant" data-prototype="<?php echo $view->escape($view['form']->row($form['participants']->get('prototype'))) ?>">
    </ul>

    <?php echo $view['form']->errors($form) ?>
    <h2>Study</h2>
    <?php echo $view['form']->label($form['studyName'])?>
    <?php echo $view['form']->errors($form['studyName'])?>
    <?php echo $view['form']->widget($form['studyName'])?>

    <h3>Participants in this study</h3>
    <ul id="participants">
        <?php foreach($form['participants'] as $participant): ?>
            <li><?php echo $view['form']->row($participant) ?></li>
        <?php endforeach; ?>
    </ul>
    <a href="#" id="add-another-participant">Add participant</a>

  </form> 
  <?php $view['slots']->stop() ?>

   <script type='text/javascript'>
      // keep track of how many participant fields have been rendered
      var participantCount = document.getElementById("participants").length;
      jQuery(document).ready(function() {
          jQuery('#add-another-participant').click(function() {
              var participantList = jQuery('#multi-participant');

              var newParticipant = participantList.attr('data-prototype');
              newParticipant = newParticipant.replace(/\$\$name\$\$/g, participantCount);
              participantCount++;

              var newLi = jQuery('<li>,</li>').html(newParticipant);
              newLi.appendTo(jQuery('#multi-participant'));

              return false;
          });
      });

    </script>

我的页面正确显示所有现有研究参与者的可编辑表格,底部显示“添加参与者”链接。但是,当我单击链接时,什么也没有发生。

我已经尽可能地按照说明进行操作,所以我希望有人能查明错误并让我走上正确的轨道。如果您确实提供了答案,请明确说明,因为我真的不知道我在做什么 re:javascript (我最终会学习它,但需要快速解决这个问题)。

非常感谢

4

0 回答 0