Search code examples
symfonyautocompletesonata-adminsymfony-2.3symfony-sonata

GenemuFormbundle select2 integration with Sonata Admin Bundle Symfony2.3

I am trying to use select2 in my form.

I installed GenemuFormBundle and added in the Kernal.Then I added few lines in config.yml

genemu_form:
    select2: ~
    date: ~
    autocomplete: ~

then i extend sonata admin standard layout twig

{% extends 'SonataAdminBundle::standard_layout.html.twig' %}
{% block javascripts %}
    {{ parent() }}
<script src="{{ asset('bundles/admin/js/select2.js') }}" type="text/javascript"> </script>
 {% if form is defined %}{{ form_javascript(form) }}{% endif %} 
 {% endblock %}
 {% block stylesheets %}
  {{ parent() }}
<script src="{{ asset('bundles/admin/css/select2.css') }}" type="text/css"></script>
  {% if form is defined %}{{ form_stylesheet(form) }}{% endif %}
 {% endblock %}

then i added few code in admin class

$formMapper
      ->with('General')
      ->add('category', 'genemu_jqueryselect2_entity', array('class' => 'AmanFrontendBundle:MtCat', 'property' => 'catName'))

After doing all this i got

enter image description here

AutoSuggest is not working and why i am getting a text box and drop down.

javascript and css that loaded on the page are

        <link rel="stylesheet" href="/aman/web/bundles/sonataadmin/bootstrap/css/bootstrap.min.css" type="text/css" media="all"  />
        <link rel="stylesheet" href="/aman/web/bundles/sonataadmin/bootstrap/css/bootstrap-responsive.min.css" type="text/css" media="all" />

        <!-- base application asset -->
        <link rel="stylesheet" href="/aman/web/bundles/sonataadmin/css/layout.css" type="text/css" media="all" />
        <link rel="stylesheet" href="/aman/web/bundles/sonataadmin/css/colors.css" type="text/css" media="all" />

<script src="/aman/web/bundles/admin/css/select2.css" type="text/css"></script>


        <script src="/aman/web/bundles/sonatajquery/jquery-1.8.3.js" type="text/javascript"></script>
        <script src="/aman/web/bundles/sonatajquery/jquery-ui-1.8.23.js" type="text/javascript"></script>
        <script src="/aman/web/bundles/sonatajquery/jquery-ui-i18n.js" type="text/javascript"></script>

        <script src="/aman/web/bundles/sonataadmin/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>

        <script src="/aman/web/bundles/sonataadmin/jquery/jquery.form.js" type="text/javascript"></script>
        <script src="/aman/web/bundles/sonataadmin/jquery/jquery.confirmExit.js" type="text/javascript"></script>            <script src="/aman/web/bundles/sonataadmin/base.js" type="text/javascript"></script>

    <script type="text/javascript">
              jQuery(document).ready(function($) {
                $field = $('#s5248479f910c0_category');

                  $field.select2({"placeholder":"Select a value","allowClear":false,"minimumInputLength":0,"width":"off"});
        });
</script>

And i also execute 

sudo php app/console assets:install web/

Anything else i forget to add. Please help me out.

Solution

  • Now Onward select2 support has been added to sonata admin bundle latest repository. please update your sonata admin bundle to latest repository.