使用symfony2表单类型中的嵌套集合表单字段未正确呈现数据原型

时间:2013-05-24 10:19:00

标签: forms symfony doctrine-orm twig

我正在用symfony2.2构建一个项目,我在这里发帖是因为我在集合中遇到了嵌套集合的问题。 我想渲染一个表格,对于这种学说实体:

http://i.stack.imgur.com/QmESP.jpg

但是在这里,周期对象不是渲染,而单独渲染它可以完美地工作。 事实上,数据原型是正确的,但它没有将数据原型嵌套在主数据原型中。

所以问题是:如何在主数据原型中正确打印嵌套数据原型?

Twig模板:

<fieldset class="nestedFormWeekDay" data-prototype="{{ form_widget(form.weekDays.day.vars.prototype)|e }}">
<legend>Weekday</legend>
</fieldset>
    {{ func.add_delete_form_elem('fieldset.nestedFormWeekDay', '<fieldset><legend>day</legend>', '</fieldset>') }}
</fieldset>

主要原型的HTML:

<html>
<head></head>
<body>
    <div id="timebundle_jsschedulertype_weekDays_day___name__">
        <div class="formSlot">
            <input id="timebundle_jsschedulertype_weekDays_day___name___isUltimo" type="hidden" name="timebundle_jsschedulertype[weekDays][day][__name__][isUltimo]">
            <div class="formSlot">
                <p class="formSlot">
                <p class="form"></p>
                <div id="timebundle_jsschedulertype_weekDays_day___name___period" data-prototype="<div class="formSlot"> <p class="formSlot"><label class="required">__name__label__</label></p> <p class="form"><div id="timebundle_jsschedulertype_weekDays_day___name___period___name__"><div class="formSlot"><p class="formSlot"><label class="required">Starttime</label></p><p class="form"><div id="timebundle_jsschedulertype_weekDays_day___name___period___name___startTime"><div class="formSlot"><p class="formSlot"><label class="required">Singlestarttime</label></p><p class="f...><option value="45">45</option><option value="46">46</option><option value="47">47</option><option value="48">48</option><option value="49">49</option><option value="50">50</option><option value="51">51</option><option value="52">52</option><option value="53">53</option><option value="54">54</option><option value="55">55</option><option value="56">56</option><option value="57">57</option><option value="58">58</option><option value="59">59</option></select></div></p></div></div></p></div></div></p> </div> ">
        </div>
            <p></p>
    </div>
</body>
</html>

SchedulerType:

->add('weekDays', new JSWeekdaysType(), array('required' => false))

WeekDaysType:

->add('day', 'collection', array('type' => new JSDayType(), 'allow_add' => true, 'by_reference' => false, 'allow_delete' => true))

DaysType:

->add('period', 'collection', array('type' => new JSPeriodType(), 'allow_add' => true, 'by_reference' => false, 'allow_delete' => true))

PeriodType:

->add('startTime', new JSSingleStartType())
->add('timeSlot',  new JSTimeSlotType());

SchedulerController:

$Scheduler = new JSScheduler();
$SchedulerType = new JSSchedulerType();
$form = $this->createForm($SchedulerType, $Scheduler);
return $this->render('TimeBundle:Form:newJsScheduler.html.twig', array('form' => $form->createView()));

最后是允许我添加新实体的javascript函数:

function add_element($container, $wrap_beg, $wrap_end)
{
    var index = $container.find(':input').length;
    var input = $container.attr('data-prototype').replace(/__name__/g, index);
    $input = '<div class =\'new\'>'+$wrap_beg+input+$wrap_end+'<hr/></div>';
    $container.append($input);
}

完整的HTML:http://pastebin.com/sL8Z3Nxc

1 个答案:

答案 0 :(得分:0)

嗯,渲染的唯一方法是将jquery函数'add_delete'转换为递归。 做一些像:

function handle_nested_form(container)
{
  if (typeof container != 'object' || typeof container.children != 'function' )
     return;
  if (typeof container.attr('data-prototype') != 'undefined')
  {
    //Do whatever you need to do with the 'data-prototype' element 
  }
  var size = container.children().length;
  if (size)
  {
     container.children().each(function(){ handle_nested_form($(this))});
  }

}