Comment personnaliser l'attribut data-prototype dans Symfony 2 formes

Un peu vieux, mais voici une solution simple mortel.

L'idée est tout simplement de rendre les articles de la collection par le biais d'un template Twig, de sorte que vous avez la pleine capacité de personnaliser le prototype qui sera placé dans votre data-prototype="..." tag. Juste comme si c'était normal, forme habituelle.

Dans yourMainForm.html.rameau:

<div id="collectionContainer"
     data-prototype="
         {% filter escape %}
             {{ include('MyBundle:MyViewsDirectory:prototype.html.twig', { 'form': form.myForm.vars.prototype }) }}
         {% endfilter %}">
</div>

Et dans MyBundle:MyViewsDirectory:prototype.html.rameau:

<div>
    <!-- customize as you wish -->
    {{ form_label(form.field1) }}
    {{ form_widget(form.field1) }}
    {{ form_label(form.field2) }}
    {{ form_widget(form.field2) }}
</div>

De crédit: adapté de https://gist.github.com/tobalgists/4032213

Vous avez probablement trouvé depuis, mais voici la solution pour les autres.

Créer un nouveau modèle et de copier/coller ce code:
https://gist.github.com/1294186

Ensuite dans le modèle contenant le formulaire que vous souhaitez personnaliser, de les appliquer à votre forme en faisant ceci:

{% form_theme form 'YourBundle:Deal:Theme/_field-prototype.html.twig' %}

Je sais que la réponse est très tard, mais il peut être utile pour les visiteurs.

sur votre fichier de thème, vous pouvez simplement utiliser un bloc pour le rendu de chaque entrée de collection de sites web widget comme suit:

{% block _jobcast_profilebundle_websitestype_websites_entry_widget %}
     <div class="informations_widget">{{ form_widget(form.type.code) }}</div>
     <div class="informations_error">{{ form_errors(form.type) }}</div>
     <div class="informations_widget">{{ form_widget(form.url) }}</div>
     <div class="informations_error">{{ form_errors(form.url) }}</div>
{% endblock %}

également créer thème bloc pour votre collection de widget ligne comme suit:

{% block _quiz_question_answers_row %}
     {% if prototype is defined %}
        {%- set attr = attr | merge({'data-prototype': form_row(prototype) }) -%}
    {% endif %}

     {{ form_errors(form) }}

     {% for child in form %}
         {{ form_row(child) }}
     {% endfor %}
{% endblock %}

maintenant le prototype et le rendu de la collecte d'entrée sera le même.

Application large forme de thématisation sera appliqué pour le prototype.
Voir De faire la Demande à l'échelle de Personnalisations

Pour personnaliser différemment existant les éléments de la collection VS prototype, vous pouvez remplacer collection_widget comme ceci:

{%- block collection_widget -%}
    {% if prototype is defined %}
        {%- set attr = attr|merge({'data-prototype': form_row(prototype, {'inPrototype': true} ) }) -%}
    {% endif %}
    {{ - block('form_widget') - }}
{%- endblock collection_widget -%}

Et puis dans votre entrée personnalisée:

{% block _myCollection_entry_row %}

  {% if(inPrototype is defined) %}
      {# Something special only for prototype here #}
  {% endif %}
{% endblock %}

Ce message met l'accent sur l'utilisation de conventions préexistantes dans le template twig.

Basant off "Comment Imbriquer une Collection de Formulaires de Symfony livre de recettes (http://symfony.com/doc/master/cookbook/form/form_collections.html), vous pouvez saisir n'importe quel html_escaped des données de formulaire que vous souhaitez dans le data-prototype (peut-être considéré comme un hack, mais qui fonctionne à merveille) et uniquement les pages utilisant ce modèle va changer.

Dans l'exemple, ils vous disent de mettre:

    <ul class="tags" data-prototype="{{ form_widget(form.tags.vars.prototype)|e }}">
    ...
    </ul>

Cela peut être remplacé avec succès par quelque chose comme:

<table class="tags" data-prototype="&lt;tr&gt;  &lt;td&gt;&lt;div&gt;&lt;input type=&quot;text&quot; id=&quot;task_tags__name__tagId&quot; name=&quot;task[tags][__name__][taskId]&quot; disabled=&quot;disabled&quot; required=&quot;required&quot;    size=&quot;10&quot; value=&quot;&quot; /&gt;&lt;/div&gt;&lt;/td&gt; &lt;td&gt;&lt;div&gt;&lt;input type=&quot;text&quot; id=&quot;task_tags__name__tagName&quot; name=&quot;task[tags[__name__][tagName]&quot; required=&quot;required&quot; value=&quot;&quot; /&gt;&lt;/div&gt;&lt;/td&gt;&lt;/tr&gt;">
    <tr>
        <th>Id</th>
        <th>Name</th>
    </tr>
    <tr>
    ...pre existing data here...
    </tr>
</table>    

Où le type de données d'attribut de la table avec la classe "tags" ci-dessus est la version html version échappée (et les sauts de ligne supprimée si les espaces sont ok et nécessaire) de:

<tr>
    <td><div><input type="text" id="task_tags__name__tagId" name="task[tags][__name__][taskId]" disabled="disabled" required="required"    size="10" value="" /></div></td>
    <td><div><input type="text" id="task_tags__name__tagName" name="task[tags[__name__][tagName]" required="required" value="" /></div></td>
</tr>

...mais vous devez également ajuster le javascript dans l'exemple d'ajouter des tr au lieu de li éléments:

function addTagForm(collectionHolder, $newLinkTr) {
    ...
    //Display the form in the page in an tr, before the "Add a question" link tr
    var $newFormTr = $('<tr></tr>').append(newForm);
    ...
};

...

//setup an "add a tag" link
var $addTagLink = $('<a href="#" class="add_tag_link">Add a tag</a>');
var $newLinkTr = $('<tr></tr>').append($addTagLink);

...

Pour moi, la prochaine étape est de savoir comment définir le prototype dans un fichier externe que je peux appeler d'une certaine manière dans le template twig pour le data-prototype dynamique qui travaille avec le formulaire. Quelque chose comme:

<table class="tags" data-prototype="{{somefunction('App\Bundle\Views\Entity\TagsPrototypeInTable')}}">

Donc, si l'un des autres postes est de décrire, et je suis trop dense ou si quelqu'un sait comment faire ce genre, dites-le!

Il y a un lien quelque chose à partir de gitHub de François, mais je ne vois aucune explication donc je pense que c'est probablement le plus dynamique de la méthode, je vais aller à un de ces jours prochains.

De la paix,
Steve

Mise à jour:

On peut également utiliser des pièces de la maquette:

data-prototype="<tr>  <td>{{ form_row(form.tags.vars.prototype.tagId) | e }}</td> <td>{{ form_row(form.tags.vars.prototype.tagName) | e }}</td></tr>"

Où le type de données d'attribut de la table avec la classe "tags" ci-dessus est la version html version échappée (et les sauts de ligne supprimée si les espaces sont ok et nécessaire) de:

<td>{{ form_row(form.tags.vars.prototype.tagId) | e }}</td>
<td>{{ form_row(form.tags.vars.prototype.tagName) | e }}</td>

(J'ai utilisé http://www.htmlescape.net/htmlescape_tool.html.)

Symfony va remplacer les informations entre les {{}} avec un html_escaped (en raison de l' "|e") a rendu le terrain lorsque la page est affichée. De cette façon, toute personnalisation au niveau du terrain n'est pas perdu, mais! vous devez d'abord ajouter et supprimer des champs pour le prototype comme vous le faites avec de l'entité 🙂