Tags Textext Jquery plugin, a good way to save created tags with symfony 2? -

i work symfony2 , try save in entity or directly in database, tags created in texarea input of tag textext jquery plug-in. don't know way persist values (noted in future want use filter suggestions functionality of plug-in).

i think method:

• take input values in hidden input created plug-in (in case: axxon_musicbundle_oeuvretype[tagz]), jquery selector, :

  tagz =$('input[name*="axxon_musicbundle_oeuvretype[tagz]"]').val(); ex:=["test","test2","test3"];

• send values controller via ajax, $('#form').submit(function() {

• in controller transform values (ex: ["test","test2","test3"]) array.

• validate.

• send database.

here extract of oeuvre mapping entity want save value.

/**  * @orm\manytomany(targetentity="tagz",cascade={"persist"})  * @orm\jointable(name="oeuvre_tagz",  *     joincolumns={@orm\joincolumn(name="oeuvre_id", referencedcolumnname="id",     nullable=false)},  *     inversejoincolumns={@orm\joincolumn(name="tagz_id", referencedcolumnname="id", nullable=false)})  **/ private $tagz; 

in formtype:

public function buildform(formbuilderinterface $builder, array $options) {  switch ($options['flowstep']) { ... case 5:         $builder->add('tagz', 'textarea', array(             'mapped' => false,             'required'=>false,         ));         break; 

my view, use multistep form, craue bundle:

{% if flow.getcurrentstep() == 5 %}     <script type="text/javascript">         $().ready(function () {             $('#axxon_musicbundle_oeuvretype_tagz').textext({ plugins: 'tags' });             $('#form').submit(function() {  $('form').get(0).setattribute('action', '{{ path("axxon_music_extractformtagz") }}');                     var tagz = array;                         tagz =$('input[name*="axxon_musicbundle_oeuvretype[tagz]"]').val();                             var actioncontroller =$("#form").attr("action");                             $.ajax({                                 type: 'post',                                 data: {'tagz': tagz},                                 url: actioncontroller,                                 success: function () {                                     $('form').get(0).setattribute('action', '{{ path("axxon_music_add_oeuvre") }}');                 ... choice ?                          });                     });     </script>     <fieldset>         <legend>etape {{ flow.getcurrentstep() }} / {{ flow.getmaxsteps() }}, ajouter des mots clefs descriptifs         </legend>         <ul>             <li>                 {{ form_row(form.tagz) }}             </li>          </ul>         {% include 'craueformflowbundle:formflow:buttons.html.twig' %}     </fieldset>  {% endif %} 

my controller want receiving data:

    public function extractformtagzaction(){       if ($this->getrequest()->isxmlhttprequest()) {          $tagz = $this->getrequest()->request->get('tagz');     } 

many thanks.

this wrong way it, can simpler , reusable.

in form, instead of

    $builder->add('tagz', 'textarea', array(         'mapped' => false,         'required'=>false,     )); 

you should have

    $builder->add('tagz', 'tag_text', .... )); 

then need build new form type, let's call tagtexttype. it's parent "textarea" , name "tag_text". in form templates, have make

{% block tag_text_widget %}....{% endblock %} 

in put required javascript.

now here comes tricky part: in tagtexttype, have addtransformer convert existing tags string, or explode text array of tags. topic big me write here, have documentation on symfony site.

as example you, check widget. using other plugin, idea:

{% block jquerytexttags_widget %}      {{ form_widget(form) }}       <script type="text/javascript">         $("#{{ id }}").textntags( {             triggers: {'@': { uniquetags : false } } ,             ondatarequest: function (mode, query, triggerchar, callback) {                 var data = {{ availableusers|raw }} ;                 query = query.tolowercase();                 var found = _.filter(data, function(item) { return item.name.tolowercase().indexof(query) > -1; });                 callback.call(this, found);             }         } );     </script> {% endblock %} 

it can tricky start once build it, able use anywhere want. imagine big, nested forms still rendered 1 line

{{ form_widget(form) }} 

cool, isn't it? :)